RTK Query - UseLazyQuery method call returns undefined when called from an unmounted component

[MateuszGroth]

Preconditions:

Define a query with keepUnusedDataFor: 0, eg.

    getPost: build.query<Post, void>({
      query: () => ({
        url: `/post`,
        method: "GET",
      }),
      keepUnusedDataFor: 0,
    }),

Have a modal, a button or whatever that you can unmount after triggering an action (clicking the CTA or something)

const TestComponentWrapper = () => {
  const [mounted, setMounted] = useState(true);
  if (!mounted) {
    return;
  }

  return <TestComponent unmount={() => setMounted(false)} />;
};

const TestComponent = ({ unmount }: { unmount: () => void }) => {
  const [getPost] = useLazyGetPostQuery();
  const onClick = async () => {
    unmount();
    const response = await getPost().unwrap();
    console.log({ response });
  };
  return <button onClick={onClick}>Test</button>;
};

render

<TestComponentWrapper />

The response in this case is undefined, even if the API returns valid data

I would expect the data to be returned from await getPost().unwrap() even if it's not kept in cache due to keepUnusedDataFor: 0,

"react": "19.2.3",
"react-dom": "19.2.3",
"@reduxjs/toolkit": "2.11.2"

[markerikson]

That's a really weird edge case :) tbh this is not going to be a particular priority to look at due to how obscure it is.

What's the real-world situation where this is happening? What are you hoping to do with the data after it's returned?

[jtoming830]

Seems we have same issue.
Case is following:

• some component initiates a time-consuming operation on BE so BE returns ID of request and then we have separate endpoint for polling the status of operation
• this component might be unmounted (e.g. if user goes to another page)
• we poll via setTimeout up to N minutes and once operation status is successful we notify the customer

To be fair there are 2 issues in the case itself:

1. Definitely not the best UX (user might work on something and then he gets notification about operation initiated 15 minutes ago while he already completely out of context)
2. Not sure that we need RTKQ here at all. Our strategy for components is simple rule of thumb - RTKQ is good, axios is bad but maybe this is literally the case when we shoot ducks from bazooka.

Though I can imagine when in simple cases this behavior might cause issues - requests might take e.g. 20 seconds just because of some network issue and within this timeframe user might go to another page causing unmount of the query initiator. If the request was supposed to update the state then it might cause stale data. E.g. something like that in some change or click handler:

  await someSlowRequest().unwrap()
  // request above took 20 seconds, user left the page and component is unmounted now
  const data = await someLazyQuery().unwrap()
  // try to update e.g. LS, dispatch any action, whatever and TS gives no hint that `data` might be `undefined`

Also it seems like some kind of regression - we recently updated our core libs and this issue appeared. We have been using RTKQ for more than a year without any issues.