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.

reactive variables not working after calling resetStore()

See original GitHub issue

Intended outcome:

I have a reactive variable: export const isLoggedIn = makeVar(false);

Here is client initialization:

export const graphqlClient = new ApolloClient({
  link: ApolloLink.from([authLink, logoutLink, httpLink]),
  cache: new InMemoryCache({
    typePolicies: {
      Query: {
        fields: {
          user: {
            read() {
              return {
                isLoggedIn: isLoggedIn(),
              };
            },
          }
        },
      },
    },
  }),
});

And I have a query:

export const GET_IS_USER_LOGGED_IN = gql`
  query GetIsUserLoggedIn {
    user @client {
      isLoggedIn
    }
  }
`;

I use this query in some place like this:

const { data: { user: { isLoggedIn } } } = useQuery(GET_IS_USER_LOGGED_IN);

Then I call graphqlClient.resetStore();

and after that I try to update reactive variable value like this isLoggedIn(true);

isLoggedIn should become true in this code:

const { data: { user: { isLoggedIn } } } = useQuery(GET_IS_USER_LOGGED_IN);

Actual outcome:

When you call graphqlClient.resetStore();

and after that you update reactive variable value like this:

isLoggedIn(true);

queries which use this reactive variable are not updated, for example this query still returns false in isLoggedIn property:

const { data: { user: { isLoggedIn } } } = useQuery(GET_IS_USER_LOGGED_IN);

But if I never use graphqlClient.resetStore(); and try to update reactive variable value like this isLoggedIn(true); all works great.

How to reproduce the issue: Here is sandbox

First click click to reset store button and after that click click to change reactive variable value button. You will see that value is still false.

But if you just click click to change reactive variable value button, value will be changed to true.

Versions System: OS: macOS Mojave 10.14.6 Binaries: Node: 15.4.0 - ~/.nvm/versions/node/v15.4.0/bin/node Yarn: 1.22.10 - /usr/local/bin/yarn npm: 7.0.15 - ~/.nvm/versions/node/v15.4.0/bin/npm Browsers: Chrome: 88.0.4324.150 Edge: 88.0.705.63 Firefox: 84.0.1 Safari: 13.0.5 npmPackages: @apollo/client: ^3.3.8 => 3.3.8

Issue Analytics

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

github_iconTop GitHub Comments

2reactions
pavelspichonakcommented, Feb 8, 2021

@jcreighton yeah you are right. In the sandbox after updating to 3.3.8 it works. But in my project I use 3.3.8 and still have this issue. I will try to figure out why behavior in my project differs from behavior in the sandbox and will write again. Thanks.

1reaction
benjamncommented, Feb 12, 2021

@vladimir-drachuk We have a company-wide deadline today (peer reviews are due), but @jcreighton is actively working on fixing this.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Advanced topics on caching in Apollo Client
To reset the cache without refetching active queries, use client.clearStore() instead of client.resetStore() . Responding to cache resets. You can register ...
Read more >
What is the proper way to wait for reactive variables in tests?
When I write a test for the component, I'm forced to use await waitFor(() => {}); in the test. describe("ProfileHeader", () => {...
Read more >
Advanced Topics on Caching – Angular
Since these queries are cached by both the initial query and their parameters, a problem arises when later retrieving or updating paginated ...
Read more >
Integrating Apollo with Vue and Vuex
If you are new to GraphQL, you should try without Apollo first. ... Make a file inside src called apolloClient.js and add the...
Read more >
[Solved]-Reset store after logout with Apollo client-Reactjs
I was also having the logout related problem. After using client.resetStore() It refetched all pending queries, so if you logout the user and...
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