query
query copied to clipboard
Some part of the query state is lost during channel broadcast
Describe the bug
App uses broadcastQueryClient utility, components that use the same query lose their query state after opening a new window that triggers the same query.
Adding some context to how I use react-query in my daily job. We are using the default broadcastQueryClient
config to sync data if user decides to open app in new tab. In some cases, we utilize isFetchedAfterMount
to ensure that user sees the latest data without UI flick. The loading screen is rendered until isFetchedAfterMount
is switched to true
. On one of the screens we have a link to another part of the app that uses same query. If user click "Open in new tab" on screen that uses isFetchedAfterMount
, it will swtich back to false
after loading of that query is finished on other tab.
Your minimal, reproducible example
CRA bootstrapped project;
- npm install
- npm start https://github.com/markivancho/react-query-broadcast
Steps to reproduce
Watch the attached video in the repo's readme.
Expected behavior
I would expect that isFetchedAfterMount
stays the same, regardless of queryClient syncs between tabs.
How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
macOS, Chrome Version 102.0.5005.115 (Official Build) (x86_64)
react-query version
4.0.0-beta.23 and 3.39.1
TypeScript version
No response
Additional context
Some console logging of queryObserver of my production app. First one is state of query after loading is finished in first tab. Second is state of query in first tab after loading is finished in second tab
notice that dataUpdateCount
of initialState
and state
in each screenshot, that's where the part of isFetchedAfterMount
logic is hidden