Refetch with New Variables Overrides Other Existing Refetches

[aLpSabre]

I'm encountering a challenge with refetching data in a Vue.js application using Vue Apollo and Apollo Client, particularly after changing the context. Our application's context changes dynamically, making it essential to fetch the most up-to-date data from the server. This is crucial since the entities in our application are shared with mutations across these various contexts.

GraphQL query:

query BookList($libraryContext: LibraryContextFilter, $filter: ListFilter) {
 books(libraryContext: $libraryContext, filter: $filter) {
     page
     limit
     total
     items {
      id
      title
      genre
      author {
        name
      }
     }
   }
}

In the BookStore:

const bookFilter = computed(() => ({
    library: bookStore.libraryFilter,
}));

const {
    loading: queryLoading,
    onResult,
    error,
    refetch,
} = useQuery<{ books: BookList }>(BookListQuery, bookFilter,options);

In the component Book.vue:

watch(
    libraryContext,
    async (value) => {
        await bookStore.refetch({ libraryContext: value, fetchPolicy: "network-only" })
        selectedBooks.value = [];
    },
    { deep: true }
);

The issue arises when refetching data after a context change. I noticed that using a refetch with the fetchPolicy: "network-only" seems to inadvertently alter the default fetch policy for other queries and refetch operations within the application. As a solution, I've reverted the fetch policy to cache-first for other refetch operations.

My question is: Is this overriding behavior of the refetch is an expected behavior or a bug? Is there a more appropriate method to ensure fresh data retrieval from the server without impacting the global fetch policy settings?

Versions
"vue": "^3.4.15",
@vue/apollo-composable: "^4.0.1",
"@apollo/client": "^3.8.10",

[phryneas]

Hi Muhammed,

the Apollo Client version of refetch doesn't allow for changing a fetchPolicy, so I assume this is something over in the VueJs side.

I hope they can help you more in vuejs/apollo#1537, but I fear in this repo, we can do nothing about this issue - I'm sorry.

I hope it's okay if I close this here. Should anything come up over on the Vuejs side that indicates that this is actually an error on our side, feel free to reopen, or open a new issue - whatever feels more appropriate then.

[github-actions]

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]

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.