Cache-and-network causes refetching from the server if a mutation updates some nested data in the cache

A have a react app that fetches some complex data from a server using useQuery and the cache-and-network policy. The data contains lots of nested types. I have a form that updates some of the data by using a useMutation but doesn’t define a update option, meaning the cache is updated automatically based on typename and id. However, when this nested data is update, the top-level useQuery triggers a refetch from the server. This is unexpected because the arguments to the useQuery don’t change and there’s nothing in the docs about cache-and-network fetch policy triggering a refetch if some nested data is updated from a separate mutation.

Does it help if you add nextFetchPolicy: 'cache-first' to the useQuery?

That seems to have done the trick. Thank you.

1 Like

The issue is that it’s not documented anywhere that if some mutation alters some of the nested data of a query with cache-and-network, it will trigger a refetch.
I’m wondering why this behaviour exists?

This is the best explanation I can find from the developers:

I 100% agree that this should be better documented