RTKQ: Mutation gets stuck in 'Pending' despite rejection from the server.

See original GitHub issue

Hi,

On multiple places, since I’ve updated our package the mutation is stuck on ‘Pending’ even when an error is thrown.

See screenshot and code below. The server returns 422, but the mutation doesn’t get rejected.

It works with fulfilled mutation, but not rejected ones. I have the issue in multiple places in my codebase and had to revert back to handling the state manually.

Any clues? Thank you!

// Mutation
  verifyEmail: builder.mutation({
      query: ({ key, email }) => ({
        url: `membership/validate-email/${key}/${email}`,
        method: "PUT",
      }),
      
 // In my component

   const [
    verifyEmailMutation,
    { isLoading, isError, isSuccess, isUninitialized },
  ] = useVerifyEmailMutation();
  
  <button onClick={() => { isUninitialized && verifyEmailMutation({ key, email }); } > Button </button>
Screen Shot 2021-08-03 at 10 59 28

Issue Analytics

  • State:open
  • Created 2 years ago
  • Reactions:3
  • Comments:25 (10 by maintainers)

github_iconTop GitHub Comments

1reaction
dominikbersecommented, Oct 12, 2022

I encountered a similar problem, but it was probably just misusage from my side. For me the request kept hanging as pending because I had a request argument that depended on the current time, which of course changed with every execution.

Something like this:

  const since =
    listState === 'closed'
      ? subDays(new Date(), 90)
      : listState === 'new'
      ? subDays(new Date(), 7)
      : undefined;

  const {
    currentData,
    error,
    isFetching,
  } = useGetDataQuery({
    since: since?.toISOString(),
  });

I resolved this by using the current date without time as a reference point, so since stays constant. Since this was probably just my fault, I did not take the time to set up a repository. However I thought I should just quickly share my finding.

If it is helpful to you, I can set up a repository reproducing this behavior as soon as I have the time.

0reactions
markeriksoncommented, Dec 21, 2022

@axinvd : yeah, that’s to be expected. If an error is thrown in the reducer, then the state never actually gets updated.

Read more comments on GitHub >

github_iconTop Results From Across the Web

RTKQ: Mutation gets stuck in 'Pending' despite rejection from ...
Hi,. On multiple places, since I've updated our package the mutation is stuck on 'Pending' even when an error is thrown.
Read more >
Some mutation stayed "pending" during update query
When i use a mutation to update my "post", sometime the api call is blocked and the status is pending on "redux devtools"....
Read more >
Redux Essentials, Part 8: RTK Query Advanced Patterns
As with adding posts, the first step is to define a new mutation ... to check for the pending/fulfilled/rejected actions dispatched by ...
Read more >
React Redux Toolkit RTK Query Crash Course - YouTube
In this video we will explore the Redux Toolkit RTK Query and Mutations in detail with example. RTK Query is a powerful data...
Read more >
Redux Toolkit and RTK Query with React | by Joshua Hawks
As long as you are only communicating with one server, this will be the only slice you need. After the baseQuery is established,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found