Apollo-client: AC3: using @apollo/client/link/schema breaks SSR

[macrozone]

Edit: i found the culprit: its @apollo/client/link/schema

workaround is to use "@apollo/link-schema": "^2.0.0-beta.3", instead.

This problem arises if you bypass the network in SSR by using link-schema on the server instead of normal http-link.

Original post:

When doing SSR (in a nextjs project), you get this error:

ApolloError: Cannot use GraphQLSchema "[object GraphQLSchema]" from another module or realm.

  Ensure that there is only one instance of "graphql" in the node_modules
  directory. If different versions of "graphql" are the dependencies of other
  relied on modules, use "resolutions" to ensure only one version is installed.

  https://yarnpkg.com/en/docs/selective-version-resolutions

  Duplicate "graphql" modules cannot be used at the same time since different
  versions may have different capabilities and behavior. The data from one
  version used in the function from another could produce confusing and
  spurious results.

i made sure that i only have one version of graphql in my yarn.lock. I tried multiple versions without luck (14.7.0 and 15.3.0)

Intended outcome:

SSR should work

Actual outcome:

see error above

How to reproduce the issue:

using apollo-client with ssr. Same problem happens if i do snapshot testing with jest

Versions

System:
OS: macOS 10.15.5
Binaries:
Node: 12.13.1 - ~/.nvm/versions/node/v12.13.1/bin/node
Yarn: 1.22.0 - /usr/local/bin/yarn
npm: 6.12.1 - ~/.nvm/versions/node/v12.13.1/bin/npm
Browsers:
Chrome: 83.0.4103.116
Firefox: 76.0.1
Safari: 13.1.1
npmPackages:
@apollo/client: ^3.0.1 => 3.0.1
apollo-server-micro: ^2.15.1 => 2.15.1
apollo-upload-client: ^13.0.0 => 13.0.0
next-with-apollo: ^5.1.0 => 5.1.0

[macrozone]

workaround is to patch @apollo/client and disable the check:

```
diff --git a/node_modules/@apollo/client/link/schema/schema.cjs.js b/node_modules/@apollo/client/link/schema/schema.cjs.js
index 8da9abc..4eb2f68 100644
--- a/node_modules/@apollo/client/link/schema/schema.cjs.js
+++ b/node_modules/@apollo/client/link/schema/schema.cjs.js
@@ -987,7 +987,8 @@ function instanceOf(value, constructor) {
var className = constructor.name;

 if (className && valueClass && valueClass.name === className) {

- throw new Error("Cannot use ".concat(className, " \"").concat(value, "\" from another module or realm.\n\nEnsure that there is only one instance of \"graphql\" in the node_modules\ndirectory. If different versions of \"graphql\" are the dependencies of other\nrelied on modules, use \"resolutions\" to ensure only one version is installed.\n\nhttps://yarnpkg.com/en/docs/selective-version-resolutions\n\nDuplicate \"graphql\" modules cannot be used at the same time since different\nversions may have different capabilities and behavior. The data from one\nversion used in the function from another could produce confusing and\nspurious results."));
+ return true
+ //throw new Error("Cannot use ".concat(className, " \"").concat(value, "\" from another module or realm.\n\nEnsure that there is only one instance of \"graphql\" in the node_modules\ndirectory. If different versions of \"graphql\" are the dependencies of other\nrelied on modules, use \"resolutions\" to ensure only one version is installed.\n\nhttps://yarnpkg.com/en/docs/selective-version-resolutions\n\nDuplicate \"graphql\" modules cannot be used at the same time since different\nversions may have different capabilities and behavior. The data from one\nversion used in the function from another could produce confusing and\nspurious results."));
}
}
```

it could be a problem with commonjs vs esm. But since we don't use graphql directly, its a mess between @apollo/client and some other package.

EDIT: this seems only to work with dev build, not prod :-(

it now throws an error:

Expected <long schema> to be a GraphQL schema.

[macrozone]

i guess the problem happens whenever you use @apollo/client directly under nodejs (and not compiled to browser)

[macrozone]

downgrading to 3.0.0-rc.3 solves the issue

this also involes to to readd and use these packages:

   "@apollo/link-context": "^2.0.0-beta.3",
    "@apollo/link-schema": "^2.0.0-beta.3",
    "@apollo/react-ssr": "4.0.0-beta.2",

i can try to bisect until i find the broken version

Edit: well... it works also with current version. But problem is:

using @apollo/client/link/schema --> breaks
using @apollo/link-schema --> works!

[benjamn]

@macrozone See #6624, coming soon in 3.0.2!

[benjamn]

This should now be fixed in @apollo/[email protected]. Let us know if it isn't fixed, and we can reopen this issue.

[macrozone]

@benjamn wow thx!

Edit: yes, it fixes the issue!

[marwan38]

I'm facing the same issue as OP, except under different circumstances. I am using the schema link client side to mock queries and mutations that we don't currently have data for.

I have tried everything from module resolutions (yarn), to listing dependencies and making sure they're all using the same graphql module, deduping.. etc.

This happens on @apollo/[email protected] and @apollo/[email protected].

[abhishiv]

Still facing this issue with - 3.2.5