Upgrading from Next.js 14.1.0 to 14.1.1 breaks apollo-client-nextjs

[linucks]

Link to the code that reproduces this issue

https://github.com/linucks/nextjs-apollo-bug

To Reproduce

1. Install dependencies and start node with: npm install && npm run dev
2. Navigate to: http://localhost:3000/

Current vs. Expected behavior

The code should perform a query using Apollo GraphQL and display the returned data. Instead it fails with:

 ⨯ app/page.tsx (15:36) @ query
 ⨯ TypeError: (0 , _apollo_ApolloRSC__WEBPACK_IMPORTED_MODULE_1__.getClient)(...).query is not a function
    at eval (webpack-internal:///(rsc)/./app/page.tsx:22:87)
    at __webpack_require__.a (/opt/nextjs-apollo-bug/.next/server/webpack-runtime.js:105:13)
    at eval (webpack-internal:///(rsc)/./app/page.tsx:1:21)
    at (rsc)/./app/page.tsx (/opt/nextjs-apollo-bug/.next/server/app/page.js:194:1)
    at Function.__webpack_require__ (/opt/nextjs-apollo-bug/.next/server/webpack-runtime.js:33:42)
    at async e7 (/opt/nextjs-apollo-bug/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:35:396786)
    at async rU (/opt/nextjs-apollo-bug/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:39:7290)
    at async /opt/nextjs-apollo-bug/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:39:10360
    at async Promise.all (index 0)
    at async rU (/opt/nextjs-apollo-bug/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:39:10036)
    at async r1 (/opt/nextjs-apollo-bug/node_modules/next/dist/compiled/next-server/app-page.runtime.dev.js:39:17308) {
  digest: '2448613812',
  page: '/'
}
  13 | `;
  14 |
> 15 | const { data } = await getClient().query({ query: testQuery });
     |                                    ^
  16 |
  17 | export default function Home() {
  18 |   return (
 GET / 500 in 167ms

Reverting to version 14.1.0 resolves the issue. All NextJS releases tested after 14.1.1 display the problem.

I originally reported the issue to the Apollo team and they advised me to file a bug report here.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 21.6.0: Thu Nov  9 00:42:02 PST 2023; root:xnu-8020.240.18.705.10~1/RELEASE_ARM64_T8101
  Available memory (MB): 8192
  Available CPU cores: 8
Binaries:
  Node: 20.9.0
  npm: 10.1.0
  Yarn: 1.22.21
  pnpm: 9.6.0
Relevant Packages:
  next: 14.2.5 // Latest available version is detected (14.2.5).
  eslint-config-next: N/A
  react: 18.3.1
  react-dom: 18.3.1
  typescript: 5.3.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Runtime

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

The problem can be circumvented by changing the code in apollo/ApolloRSC.tsx from:

export const { getClient, query, PreloadQuery } = registerApolloClient(() => {
  return new ApolloClient({
    cache: new InMemoryCache(),
    link: new HttpLink({
      uri: "https://graphqlzero.almansi.me/api",
    }),
  });
});

to save the client in a variable:

const registeredClient = registerApolloClient(() => {
  return new ApolloClient({
    cache: new InMemoryCache(),
    link: new HttpLink({
      uri: "https://graphqlzero.almansi.me/api",
    }),
  });
});
export const { getClient, query, PreloadQuery } = registeredClient;

[phryneas]

Just to add: I suspect this will break all userland code that exports a destructured method call, not just Apollo Client.

[DarlonHenrique]

same here

Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!