Refetching doesn't update the cache if the ObservableQuery is stopped before the result comes back from the server

[stubailo]

Intended outcome:

I'd like to be able to take some action, call refetch on a query, unmount the Query component right away, and still have the cache update.

Actual outcome:

Right now, the queryId is cleaned up as soon as the ObservableQuery has no subscribers, which means that when the refetch result comes back from the server, it is ignored. So that means when you come back to that view in the UI, you still see the old data even though we sent a request to the server and got a response for it.

How to reproduce the issue:

Should be easy to write a failing test like so (happy to do it):

// pseudocode
c = new ApolloClient(mock: [result1, result2, ...more result 2])
q = gql`...`

o = c.watchQuery
s = o.subscribe
r = o.result()
o.refetch() // this part doesn't work because of the unsub below
s.unsubscribe

o2 = c.watchQuery
o2.subscribe
r2 = o.result()

assert(r1 !== r2)
assert(r2 === result2)

Basically, the test checks if the refetch updated the cache to the new server state (right now it doesn't)

Versions

  System:
    OS: macOS High Sierra 10.13.6
  Binaries:
    Node: 10.9.0 - /usr/local/bin/node
    Yarn: 1.10.1 - ~/stripe/pay-server/manage/frontend/node_modules/.bin/yarn
    npm: 6.4.1 - /usr/local/bin/npm
  Browsers:
    Chrome: 70.0.3538.102
    Safari: 12.0.1

[stubailo]

BTW happy to work on this if we think it's good behavior!

[278kunal]

I am facing a similar issue. Have set of tabs where each tab open makes a network request. If i have open a tab and switch tab, the network call is made but when I come back to the same tab, the data isn't updated. The Query component unmounts after making a Query, which let's it unsubscribe and hence apollo doesn't updates cache.