[3.9.0] inFlightLinkObservables_1.remove is not a function (it is undefined) in react-native

[efstathiosntonas]

Issue Description

After upgrading from 3.8.10 on react-native 0.73.3 I get this error: inFlightLinkObservables_1.remove is not a function (it is undefined)

I created an empty react-native project, transferred over my client setup and I do not get this error in a simple query (without graphql-codegen). I'm using latest @graphql-codegen to create my types/hooks. Cannot figure out why this is throwing so this issue is more like "help me on what might cause that".

This is the place where this throws:

apollo-client/src/core/QueryManager.ts

Line 1139 in 85fb665

inFlightLinkObservables.remove(printedServerQuery, varJson);

when I console log the entry:

{"observable":{"observers":{},"promise":{"_h":1,"_i":1,"_j":{"data":{"account_by_pk":{"id":"M5txLRYc5TMeDzknV9DUNaDoAHl2","email":"[email protected]","first_name":"Günther","last_name":"Test","onboarding_completed":true,"__typename":"account"}}},"_k":null},"handlers":{},"nextResultListeners":{},"sources":[],"sub":null,"latest":["next",{"data":{"account_by_pk":{"id":"M5txLRYc5TMeDzknV9DUNaDoAHl2","email":"[email protected]","first_name":"Günther","last_name":"Test","onboarding_completed":true,"__typename":"account"}}}]}}

concast console.log:

{"observers":{},"promise":{"_h":1,"_i":0,"_j":null,"_k":{"onFulfilled":null,"promise":{"_h":0,"_i":0,"_j":null,"_k":null}}},"handlers":{},"nextResultListeners":{},"sources":[],"sub":{"_observer":{},"_state":"ready"}}

inFlightLinkObservables console.log:

{"weakness":false,"strong":{}}

eslint went nuts after the update:

ps. This line should be removed? 🤔

apollo-client/src/core/QueryManager.ts

Line 192 in 85fb665

// TODO: remove before we release 3.9

(don't think it will make any difference, just pointing out)

Link to Reproduction

no-repro

Reproduction Steps

Update from 3.8.10 to 3.9.0 in a react-native project.

@apollo/client version

3.9.0

[efstathiosntonas]

I think the problem is with Hermes WeakRef used by toBeGarbageCollected.ts : facebook/react-native#42742

[alessbell]

Great find, @efstathiosntonas, and funny timing: I see it was opened yesterday with tracking issues on the Hermes project going back to at least 2021.

That does seem possibly relevant, but toBeGarbageCollected.ts contains testing matchers used by our Apollo Client test suite that shouldn't wind up in your bundle. One of our maintainers is out sick today and I'm still investigating this, thanks for your patience.

[efstathiosntonas]

@alessbell you're right 🤦 , should have noticed the file path!

[alessbell]

Thanks for sharing your demo, @efstathiosntonas (moving our thread over here 😊).

please note that i cannot reproduce it

I also can't reproduce it in our rn-apollo-client-testbed repo that uses codegen (all dependencies on latest). Can you confirm which versions you're using of all relevant dependencies?

[efstathiosntonas]

these are the codegen versions:

{
 "@graphql-codegen/add": "5.0.0",
    "@graphql-codegen/cli": "5.0.0",
    "@graphql-codegen/fragment-matcher": "5.0.0",
    "@graphql-codegen/introspection": "4.0.0",
    "@graphql-codegen/jsdoc": "3.0.0",
    "@graphql-codegen/typescript": "4.0.1",
    "@graphql-codegen/typescript-apollo-client-helpers": "3.0.0",
    "@graphql-codegen/typescript-operations": "4.0.1",
    "@graphql-codegen/typescript-react-apollo": "4.1.0",
    "@graphql-eslint/eslint-plugin": "3.20.1",
}

and codegen.yml:

schema:
  - "http://localhost:9091/v1/graphql":
      headers:
        x-hasura-admin-secret: myadminsecretkey
#  - "directive @connection(key: String, filter: [String]) on FIELD"
watch: true
require:
  - ts-node/register
documents: 'src/**/*.graphql'
emitLegacyCommonJSImports: false
config:
  scalars:
    DateTime: Date
    JSON: "{ [key: string]: any }"
    timestamptz: string
    numeric: number
overwrite: true
generates:
  ./src/generated/apollo-helpers.ts:
    plugins:
      - typescript-apollo-client-helpers
  ./src/generated/graphql.tsx:
    schema: schema.json
    plugins:
      - "typescript"
      - "typescript-operations"
      - "typescript-react-apollo"
      - 'jsdoc'
      - add:
          content: "/* eslint-disable */"
    config:
      constEnums: true
      #immutableTypes: true
      preResolveTypes: true
      defaultMapper: any
      reactApolloVersion: 3
      skipTypename: false
      avoidOptionals: true
      maybeValue: T
      withHooks: true
      withComponent: false
      withHOC: false
      withRefetchFn: true
    hooks:
      afterOneFileWrite:
        - prettier --write
  ./src/graphql.schema.json:
    plugins:
      - "introspection"
    config:
      minify: true
    hooks:
      afterOneFileWrite:
        - prettier --write
  ./src/generated/fragments.tsx:
   plugins:
     - fragment-matcher
     - add:
         content: "/* eslint-disable */"
   config:
     useExplicitTyping: true
   hooks:
     afterAllFileWrite:
       - prettier --write

edit: my eslint throws errors everywhere as you can see on the first comment

[alessbell]

Thanks for that @efstathiosntonas 👍

I'm looking into the eslint errors you're seeing as possibly distinct from the runtime error of inFlightLinkObservables_1.remove is not a function (could be same root cause but maybe not). I'm still getting set up to reproduce your eslint/codegen config.

On the runtime error, can you please confirm you have the transitive dependency @wry/trie v0.5.0 in your node_modules? It's a dependency of Apollo Client's that we bumped in v3.9.0 so I'm not sure why you'd have an incompatible version after upgrading, but want to confirm.

[efstathiosntonas]

ahhhh, I got @wry/trie pinned to 0.4.3 on resolutions, let me try that.

[alessbell]

Aha, that would do it! Out of curiosity: do you remember why you pinned that in the first place? Hoping that resolves the eslint errors you're seeing too :)

[efstathiosntonas]

@alessbell it works as a charm after bumping @wry/trie: 5. Thank you for your time in this one. I can't remember why on earth I had this dep pinned.

eslint errors are gone too!

[github-actions]

Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.

[alessbell]

Glad to hear it, @efstathiosntonas!

[efstathiosntonas]

@alessbell just an update, eslint errors are not gone, I guess this is codegen issue now.

[alessbell]

@efstathiosntonas would you mind opening a separate issue for that and I'll x-link to your comment above? Will take a look, thanks!

[github-actions]

This issue has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
For general questions, we recommend using StackOverflow or our discord server.