React-apollo: useQuery: on using refetch, 'loading' keeps true when same error returned twice or more

[jet2jet]

When using refetch method on the return value of useQuery, and an error returned with the same name and message for the previous error, loading value of the return value keeps true (not changes to false), even if notifyOnNetworkStatusChange option is true.

Intended outcome:

loading changes to false whenever an error returned

Actual outcome:

loading keeps true when the same error returned (though it changes to false on the _first_ error)

How to reproduce the issue:

I created an repository with the reproduction code here:
https://github.com/jet2jet/react-apollo-test

After build and open dist/index.html, when clicking 'Refetch' at first, an error data will be shown. But when clicking 'Refetch' on the third time (callCount = 4 on the log), 'Loading...' will be shown (an error data should be shown on this time).

Version

Note: I think this problem might not occur with react-apollo: 3.0.0

npmPackages:
apollo-cache-inmemory: ^1.6.3 => 1.6.3
apollo-client: 2.6.4 => 2.6.4
react-apollo: 3.0.1 => 3.0.1

[jet2jet]

I think the following code is not working as expected...
https://github.com/apollographql/react-apollo/blob/be122f036c54892cc0632ed21f41fff9574ea096/packages/hooks/src/data/QueryData.ts#L288
(it seems that equal from @wry/equality does only compares name and message for Error object: https://github.com/benjamn/wryware/blob/master/packages/equality/src/equality.ts#L72 )

[Kreozot]

I confirm the issue.
I've created the sandbox for this issue: https://codesandbox.io/s/quirky-dhawan-csdxw
First time error handled correctly, but when the query is updating, error is disappears and loading is forever true.

[Kreozot]

❗️ Important notice: When I change version of @apollo/react-hooks from 3.0.1 to 3.0.0 the issue is not reproducing.

[hinok]

I struggle with the same issue but it's not really related to refetch.

I made codesandbox that shows this issue: https://codesandbox.io/s/react-apollo-3x-and-loading-true-i7ub1

This issue doesn't exist when [email protected] is used.

[dylanwulf]

@jet2jet That code was recently added in PR #3339. The purpose of that PR was to set loading properly when refetch is called, but it seems like it's still not working correctly

[Kreozot]

Looks like a blocker for me.

[hwillson]

Could someone here re-test using React Apollo 3.1.0 and let us know if this is still an issue? Thanks!

[jet2jet]

Could someone here re-test using React Apollo 3.1.0 and let us know if this is still an issue?

@hwillson I tried with [email protected], but (unfortunately) the problem still occurs.
(reproduction: npm install --save-exact [email protected] on the repository https://github.com/jet2jet/react-apollo-test , build with npm run build, and view dist/index.html)

$ npx envinfo@latest --preset apollo --clipboard

  System:
    OS: Windows 10
  Binaries:
    Node: 10.15.0 - N:\Nodejs\v10\bin\node.EXE
    Yarn: 1.12.3 - N:\Yarn\bin\yarn.CMD
    npm: 6.4.1 - N:\Nodejs\v10\bin\npm.CMD
  Browsers:
    Edge: 44.18362.267.0
  npmPackages:
    apollo-cache-inmemory: ^1.6.3 => 1.6.3
    apollo-client: 2.6.4 => 2.6.4
    react-apollo: 3.1.0 => 3.1.0

Thanks!

[hinok]

@hwillson This issue still exists https://codesandbox.io/s/react-apollo-310-and-loading-true-tl1x0

[diazdell91]

https://github.com/apollographql/react-apollo/issues/3270#issuecomment-528300510

[jet2jet]

@hwillson I created PR #3477 to fix the problem, so please review it. Thanks.

[hwillson]

https://github.com/apollographql/react-apollo/pull/3477 has been merged (thanks @jet2jet!), and will be coming shortly in a patch release.