QueryClient.clear breaks existing queries
Describe the bug
In vue query, after calling queryClient.clear all existing queries created with useQuery instance stop working.
An example where this is problematic: I have a query fetching information about login status and user, and many more. When logging-out, I want to remove cache of all queries, because it may contain user-related data. So I call clear after logout, but then login breaks because query for user and login status works no more.
Your minimal, reproducible example
https://github.com/farmaazon/tanstack-query-repro
Steps to reproduce
- clone and run the project
- click "invalidate" button - the timestamp is refreshed, as expected
- click "clear" button
- Now "invalidate" button stops working
Expected behavior
clear removes cached data, but existing queries are still functional and reacts for invalidation.
How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
I reproduced it on linux (Garuda) chrome
Tanstack Query adapter
vue-query
TanStack Query version
v5.79.2
TypeScript version
~5.8.0
Additional context
No response
You should potentially use queryClient.resetQueries
Vue, unlike React run the setup function only once, therefore it can subscribe only once.
By calling queryClient.clear you are basically removing all queries and observers, breaking already subscribed, mounted components.
I think this should be documented somewhere. queryClient.clear says it removes connected caches, so I assumed this about it: cache not query itself.
Also, I would expect that useQuery hook works mostly the same on both frameworks, and it's implementation will take into consideration framework differences.