What causes `queryClient.invalidateQueries()` to error when all requests are good?

I wanted to add a toast-notification when doing a forced invalidation of the full cache and used this code:

      void notify.promise(
        queryClient.invalidateQueries(
          { refetchType: 'all' },
          { throwOnError: true }
        ),
        {
          pending: 'Updating all data …',
          success: 'All data updated',
          error: 'Updating failed',
        }
      );

      void notify.promise(
        queryClient.invalidateQueries(
          { refetchType: 'all' },
          { throwOnError: true }
        ),
        {
          pending: 'Updating all data …',
          success: 'All data updated',
          error: 'Updating failed',
        }
      );

The

notify.promise

notify.promise

function is from

react-toastify

react-toastify

and basically just shows a message with a spinner while pending, and then switches to either the success or the error message depending on whether the promise was fulfilled or rejected.

By adding

throwOnError: true

throwOnError: true

I thought this would do what I expected. Show sucess normally, and show error if any of the refetching queries failed. But seems the promise from

invalidateQueries

invalidateQueries

have some other error condition causing it to fail as well?

I'm getting the error message, but when I check the console and the network log, I see no requests that have failed, all is OK. Does

invalidateQueries

invalidateQueries

have a bug? Does it have a timeout of some sort? What's going on here?

TanStack•9mo ago•

4 replies

verbal-lime

What causes `queryClient.invalidateQueries()` to error when all requests are good?

I wanted to add a toast-notification when doing a forced invalidation of the full cache and used this code:

      void notify.promise(
        queryClient.invalidateQueries(
          { refetchType: 'all' },
          { throwOnError: true }
        ),
        {
          pending: 'Updating all data …',
          success: 'All data updated',
          error: 'Updating failed',
        }
      );

      void notify.promise(
        queryClient.invalidateQueries(
          { refetchType: 'all' },
          { throwOnError: true }
        ),
        {
          pending: 'Updating all data …',
          success: 'All data updated',
          error: 'Updating failed',
        }
      );

The

notify.promise

notify.promise

function is from

react-toastify

react-toastify

and basically just shows a message with a spinner while pending, and then switches to either the success or the error message depending on whether the promise was fulfilled or rejected.

By adding

throwOnError: true

throwOnError: true

I thought this would do what I expected. Show sucess normally, and show error if any of the refetching queries failed. But seems the promise from

invalidateQueries

invalidateQueries

have some other error condition causing it to fail as well?

I'm getting the error message, but when I check the console and the network log, I see no requests that have failed, all is OK. Does

invalidateQueries

invalidateQueries

have a bug? Does it have a timeout of some sort? What's going on here?

What causes `queryClient.invalidateQueries()` to error when all requests are good?

Similar Threads

What causes `queryClient.invalidateQueries()` to error when all requests are good?

Similar Threads

Similar Threads

Similar Threads