Query Stuck Loading When the Newly-Resolved Value Is Deeply Equivalent

[louisscruz]

Intended outcome:

When the variables to a given Query change, the query should be re-run with the new variables, and when the response is received, it should trigger a re-render of the Query component with the new data (and not remain in a loading state).

Actual outcome:

When the variables of a given Query change, and the received response happens to be exactly the same (at least in terms of a deep equality check), the Query component is stuck in a loading state.

How to reproduce the issue:

The issue we're seeing seems to happen specifically when two network response values are deeply equivalent. Additionally, it seems to only be an issue when the query is simultaneously going from skip={false} to skip={true}.

Here is an example: https://codesandbox.io/s/busy-perlman-8buyh

Version

  System:
    OS: macOS 10.14.4
  Binaries:
    Node: 8.9.3 - ~/.nvm/versions/node/v8.9.3/bin/node
    Yarn: 1.17.3 - ~/.yarn/bin/yarn
    npm: 6.5.0 - ~/.nvm/versions/node/v8.9.3/bin/npm
  Browsers:
    Chrome: 72.0.3626.121
    Firefox: 67.0.4
    Safari: 12.1
  npmPackages:
    apollo-cache-inmemory: 1.6.3 => 1.6.3
    apollo-client: 2.6.4 => 2.6.4
    apollo-link-context: 1.0.18 => 1.0.18
    apollo-link-http: 1.5.15 => 1.5.15
    apollo-link-retry: 2.2.14 => 2.2.14
    apollo-link-schema: 1.2.3 => 1.2.3
    react-apollo: ^3.0.1 => 3.0.1

[louisscruz]

I did some debugging of the useDeepMemo in @apollo/react-hooks and happened to sidestep the problem by swapping out:

import { equal } from '@wry/equality';

with

function equal(a, b) {
  return a === b;
}

I doubt this is a valid solution, but maybe it gives some insight into what could be going wrong.

[ducarroz]

This issue has reproduction...

[ducarroz]

This issue still occurs with react-apollo 3.1

[hwillson]

Thanks @ducarroz - yes, we haven't had a chance to get to this one yet. We will (🤞) very soon.

[Mrtblg]

Same problem here !

thank you @louisscruz for explaining it so clearly.

Temporarily patching it by sending an incremental value along with every server error response to avoid having deep identical responses

[vieira]

Hello,

Any news about this?

We are also experiencing this problem and had to downgrade to 3.0.1 where the problem does not occur.

EDIT: Seems to be solved in 3.1.2?

[louisscruz]

@vieira Maybe you're experiencing a different issue than this one then? I experience this issue on all 3.x.x versions.

3.0.1: https://codesandbox.io/s/busy-perlman-8buyh
3.1.0: https://codesandbox.io/s/summer-glade-1c0x1
3.1.1: https://codesandbox.io/s/modest-moon-78vhu
3.1.2: https://codesandbox.io/s/charming-frog-t0xib

[birge]

This is a pretty big blocker for us, any updates?

[dylanwulf]

@birge Right now the Apollo team is hard at work preparing for the graphql summit next week. Hopefully they'll get back to issues after it's over.

[amok]

I confirm the issue.

➜  ✗ yarn list @apollo/react-hooks                                                                                                                                                                  ~/porn/dinotechltd/dino-bo
yarn list v1.19.1
warning Filtering by arguments is deprecated. Please use the pattern option instead.
└─ @apollo/react-hooks@3.1.3

any updates on this?

[amok]

UPD if I set fetchPolicy to network-only it works

[louisscruz]

Any update on this?

[birge]

new year new status?

[havenchyk]

I really want to have this issue fixed, but @louisscruz @birge https://twitter.com/slicknet/status/782274190451671040

[havenchyk]

@benjamn @hwillson could you please shed some light? are you guys expecting a PR for this? Do you have it in backlog maybe?

[dylanwulf]

If this is still an issue, I would recommend trying to reproduce it in the latest @apollo/client v3 beta. If the issue still exists in the v3 beta, then maybe create a new issue in the apollo-client repo with the reproduction.

[cbishop-fv]

Blocker for me

[ducarroz]

@hwillson any chance to take a close look at this issue? we have codesandbox to reproduce it as well a test for it. Thanks.

[louisscruz]

It looks like we just need some guidance on how to solve apollographql/apollo-client#6059. The last section of the PR description makes three proposals for solving this problem. Can someone take a look?

[huchenme]

@dylanwulf yes I can confirm it is reproducible in @apollo/client v3 beta https://codesandbox.io/s/client-3-hook-0r52i, created an issue in apollo-client repo apollographql/apollo-client#6106

[huchenme]

I think we can close this now, thanks to @benjamn this issue is fixed and released to 3.0.0-beta.43 apollographql/apollo-client@7c9afe0 🎉