-
Notifications
You must be signed in to change notification settings - Fork 130
Description
- I've validated the bug against the latest version of DB packages
Describe the bug
When using @tanstack/react-query with an IndexedDB query persister via @tanstack/react-query-persist-client, setting a collection's "syncMode" to "on-demand" breaks the persister.
This seems to come from some functions that are set in the collection meta when using "on-demand" collections, which are then sent to the query itself when using queryCollectionOptions. Manually removing the subscription object from the query meta in the client in the persister does fix this, but presumably these functions would be needed in both the queried and the cached data?
To Reproduce
CodeSandbox
Steps to reproduce the behavior:
- Two collection versions of the same "pokemon" query exist. One with and without
syncMode: "on-demand"to compare - Pull up the browser debug > Console to view the error from the persister for the on-demand collection:
Uncaught (in promise) DataCloneError: Failed to execute 'put' on 'IDBObjectStore': (event) => options.onUnsubscribe(event) could not be cloned. - Pull up the browser debug > Application > IndexedDB > keyval-store > keyval > view there is no "pokemon-test" store (or there is a store that is missing the on-demand collection data, this seems to depend on the order the queries are called)
- In
src/lib/graphql/gql-client.ts, swap thepersistClientfunction to use the commented-outclientWithoutQueryMetaSubscriptionvariables andsetfunction instead of the raw client - Reload the preview page
- Pull up the browser debug > Application > IndexedDB > keyval-store > keyval > view there is now a set "pokemon-test" store with
clientState.queriescontaining each query
Expected behavior
The client can be persisted via the recommended setup from tanstack/query Building a Persister without client modification OR documention on the best practices for using on-demand collections with the tanstack query persister
Desktop (please complete the following information):
- OS: Windows 10
- Browser: Chrome
- Version: Chrome: 142.0.7444.164 (Official Build) (64-bit)
Additional context
Very excited to use this feature :) Otherwise, it seems great so far!