Error temporarily persist for useQuery for different variable set

[dannycochran]

Intended outcome:

1. If I call useQuery from componentA with a distinct variable set, and that query has an error, I expect to have an error returned back int the query result.

2. If I then change that variable set for the same query within componentA, the error should not continue to be returned, even temporarily.

Actual outcome:

The error from an older variable set is temporarily present until the fetch is complete, and then it is gone.

How to reproduce the issue:

1. clone this repository (https://github.com/dannycochran/usequery) and checkout to the errors branch.
2. npm run start
3. Navigate to localhost:3000/124891248912491
4. Notice that you will see an error from "useQuery", this is expected.
5. Click the button to return home where there is no movie query parameter.
6. Click the button to navigate to valid movie.
7. Note a flicker where the error message will temporarily render, and note in the console that the error is still present from the "useQuery" return value.
8. The error then disappears once the fetch is complete. However, since the variable set is distinct at this point, the "useQuery" state should be empty and there should be no cached value for this query yet.

it's possible this is related to #4644 which was never resolved.

Versions
System:
OS: macOS 11.4
Binaries:
Node: 12.18.4 - /usr/local/bin/node
Yarn: 1.22.4 - ~/npm-global/bin/yarn
npm: 6.14.6 - /usr/local/bin/npm
Browsers:
Chrome: 91.0.4472.114
Safari: 14.1.1
npmPackages:
@apollo/client: ^3.3.20 => 3.3.20
apollo-server-express: ^2.19.0 => 2.19.0
npmGlobalPackages:
apollo: 2.27.0

[brainkim]

Fixed by something in 3.4.8.

[benjamn]

We also have a regression test for this coming in 73569ef, part of @brainkim's big refactoring PR #8596.