`setQueryData()` successful but not triggering update in `useQuery()`
Hi all. Question: can anyone think of a reason that setQueryData() would successfully update the cache, but useQuery() with a matching query key doesn't update? This is using v3. Works in the app, but fails specifically in tests. Using msw to mock responses, and that part is working because the cache gets updated. Just useQuery() doesn't update.
5 Replies
conservation-jadeOP•3y ago
It seems the behavior I was expecting -
setQueryData() causing useQuery() instances to update without refetching - only works if staleTime is set to Infinity. Not sure if I'm understanding this correctly but that's what I'm seeing. Again, this is v3, so maybe things have changed since then.relaxed-coral•3y ago
not sure what you mean with "doesn't update". like, the component doesn't re-render?
conservation-jadeOP•3y ago
Yep, I update the cache via
setQueryData() in a useEffect hook, and I've read the cache immediately after to ensure it took, but the component doesn't rerender. The query key hasn't changed in this case, but updating the cache should update the query regardless, right?relaxed-coral•3y ago
yes, it should, unless there are no changes. Can you show a reproduction?
conservation-jadeOP•3y ago
I'll put one together 👍
I'm doing some weird stuff, to be fair - namely using static query keys that never change and my "fetcher" is redux dispatch. But the state should all still work the same to react query, and it does as long as I set staleTime to Infinity. The "why" is we have a large brownfield project that I'm trying to modernize in minimal passes per component. If I can get the react-query api in place for consumers incrementally while we're still on redux, we can eventually just swap redux out at the custom hook level and consumers and tests stay the same.
I've also come around to
staleTime: Infinity probably being ideal during this interim phase, as this mimics the non-refetching behavior of redux currently.
Anyway, yeah, will get a repro