apollographql / apollo-client

:rocket:  A fully-featured, production ready caching GraphQL client for every UI framework and GraphQL server.
https://apollographql.com/client
MIT License
19.34k stars 2.66k forks source link

refetch does not return cached data #11876

Closed ps173 closed 3 months ago

ps173 commented 3 months ago

Issue Description

This possibly may not be a bug but a intended feature but I was unable to find any doc on this. I can confirm this for only useQuery hook.

When I trigger a refetch on any query with same variables as in the initial query I can see a graphql request to the server. In my case, I used same value for my variables as in query for the refetch. This ideally provides cached data in case of initial fetch. For example:

const {data, loading, error} = useQuery(SOME_QUERY, {
  variables: {
     name: "some_name"
  }
})

In this case if I provide value that has cached data saved already then the data returned is cached data. This is intended behaviour. But if I do same with refetch method then cached data is not returned and a query is triggered.

Link to Reproduction

https://codesandbox.io/p/sandbox/restless-mountain-zjrf48?file=%2Fsrc%2Findex.js%3A46%2C23

Reproduction Steps

No response

@apollo/client version

3.10.4

phryneas commented 3 months ago

That's intentional. refetch here means "get new data from the server". It's an intentional command.

Using the useQuery hook itself doesn't cause a cache unless it needs to (or you set an according fetchPolicy) - if you were to mount the hooks in three components, you wouldn't want to see three network requests.

If you just want to change variables, there is no need to call refetch - just rerender the useQuery hook with the new variables.

ps173 commented 3 months ago

If you just want to change variables, there is no need to call refetch - just rerender the useQuery hook with the new variables.

Yes that is understood. But in cases such as debounce a refetch needs to be triggered. Obviously this is a very specific case.

I also feel like that the idea of refetch to "get new data from the server" should also be based on fetchPolicy just like useQuery. I mean if I select a certain caching / fetchPolicy that should be valid for my refetch requests as well.

phryneas commented 3 months ago

I'm sorry, but it is literally in the word: "re(execute)fetch". The whole purpose of this function is to get new data from the server and to bypass fetchPolicy.

There is no need for a function to get new data from the cache, because the cache will always update your component automatically - you always will have the newest data from the cache in your hook.

Again, the purpose of this function is not to change variables. You can choose to refetch with new variables, but that's a bonus on top of that base functionality.

You can explain your use case a bit more and we can try to find a solution for that, but right now this looks like an XY problem: you are choosing tool Y to solve problem X and ask questions about how to change the behaviour of tool Y, while it was never intended to solve problem X in the first place.

Let's take a step back and look at your problem X instead, okay? :)

ps173 commented 3 months ago

Fair enough. It does seem like an XY problem and I agree on that. Just wanted to make sure that whether it was intended for refetch to bypass fetchPolicy. As for my problem it can be handled with useLazyQuery. Thanks for the time!

github-actions[bot] commented 3 months ago

Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.

github-actions[bot] commented 2 months ago

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. For general questions, we recommend using StackOverflow or our discord server.