Query is stuck at isLoading: true but data has been fetched and no error

[joeattardi]

I'm running into an issue with RTK Query v2.2.3. It's very intermittent and there is no reliable way to reproduce it other than constantly refreshing the page and triggering the query, so I don't think I can post an example code that exhibits it. It takes a while but eventually I can reproduce it.

But what's happening is after the request succeeds, it's still stuck in a loading state. It stays in the isLoading state forever. I looked in the RTK Query devtools, and I don't even see an isLoading flag there:

Is the isLoading flag derived from other data? Could there be any situation where this gets stuck at isLoading: true even though isSuccess is true and the data has been returned?

[phryneas]

It is derived, but isLoading: true and isFetching: false should be impossible, since it's const isLoading = !hasData && isFetching.

Could you try to maybe record a Replay of it happening?

[aryaemami59]

Could there possibly be some sort of race condition involved?

[joeattardi]

I don't think so, one scenario where we can reproduce the behavior there is only one query going on, and its arguments do not change.

[joeattardi]

Hey again, follow up question on this. I'm thinking again about the query args changing too quickly.

If I'm passing a URL as a query argument, but inside an object, like this:

useQuery({ url: '/api/users' })

then a new object is coming in as the query arg each time. I know (I think, anyway) that the query args get serialized to a string but say the component gets rendered multiple times quickly for some reason. Could this new object being passed in multiple times trigger the behavior we were discussing before?

[markerikson]

Maybe? It ought to serialize to the same result every time.

[joeattardi]

I was just curious since the only way I've been able to reproduce this so far is by rapidly changing the query args in a test app, trying to figure out if there is any way I might be causing that behavior in my real app.