question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Race-condition in refetchQueries (cache-first query completes before network-only query)

See original GitHub issue

Intended outcome:

Using refetchQueries on a mutation should guarantee to update the store from the network query result.

Actual outcome:

If the application triggers the same query, that was supposed to be refetched, shortly after the mutation has run (which by default will happen with the cache-first policy), this query will typically hit the cache and complete before the network-only query issued by refetchQueries will finish.

Since the refetch query has a lower requestId its result will not be propagated to the store, see: https://github.com/apollographql/apollo-client/blob/d420cbdbb3e6637ee2e8e8c211e3d28850b93c6e/src/queries/store.ts#L135

How to reproduce the issue:

See: https://github.com/ctavan/react-apollo-error-template/tree/reproduce-refetch-query-race

I think the issue is best explained when looking at the demo app / screenshot:

screenshot 2017-06-23 15 47 25

The steps to reproduce are:

  1. Load the page -> List query is run and populates the store with 3 people.
  2. Go to “create” which unmounts the List and mounts the Create component. Clicking the button will fire a mutation which adds a new person.
  3. The mutation has refetchQueries: ['People'], specified.
  • As is visible from the console output which simulates the server behavior, apollo-client starts a network request to refetch the query right after the mutation network request has resolved (and even before the mutate() promise resolves, as indicated by Mutation done). In the example this gets lastRequestId = 4:
screenshot 2017-06-23 16 02 50
  • At this point the success callback of the resolved mutation redirects back to the List component which re-triggers the list-query there, lastRequestId = 5:
screenshot 2017-06-23 16 04 48
  • Shortly after that, the network request for the refetch resolves and as can be seen from the server output there were actually 4 elements returned.
  • However the store still only holds 3 elements for the people query as can be seen from the Apollo client dev toolbar. I assume this is because the cache-first which was executed synchronously resolved before the network-only refetch query and the network-only query was therefore discarded.

My assumption would be that refetchQueries guarantees to sync the current store with the result returned from the server and that intermediate cache-first queries cannot interfere with this.

So, is this a bug or a feature? 😃

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:11
  • Comments:24 (3 by maintainers)

github_iconTop GitHub Comments

26reactions
ctavancommented, Aug 30, 2017

The issue still persists and I believe this issue should not be closed.

21reactions
stale[bot]commented, Aug 7, 2017

This issue has been automatically marked as stale becuase it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions to Apollo Client!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Refetching queries in Apollo Client - Apollo GraphQL Docs
This method is new in Apollo Client 3.4. Refetch options. The client.refetchQueries method take an options object that conforms to the following TypeScript ......
Read more >
@apollo/client | Yarn - Package Manager
... queries using the cache-and-network or network-only fetch policies will no longer trigger additional network requests when cache results are complete.
Read more >
apollo-client - Awesome JS
Make queries with a pollInterval respect the no-cache fetch policy, ... Instead, those complete cache results will be delivered as if using the...
Read more >
refetchQueries works for only some queries - Stack Overflow
I can't see your useGetMyProfileQuery hook, but I guess the issue is with the fetch policy. Set the fetchPolicy: "network-only" in the ...
Read more >
https://raw.githubusercontent.com/bendenoz/apollo-...
Instead, those complete cache results will be delivered as if using the ... refetchQueries` as an imperative way to refetch queries, without having...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found