typescript-react-query does not work during SSR with queryClient.prefetchQuery in Next

Describe the bug

Following the example snippets in the docs and using SSR with Next, the prefetchQuery never makes a request.

Reading the docs one would need exposeQueryKeys and exposeFetcher. exposeFetcher even states: “For each generate query hook adds fetcher field with a corresponding GraphQL query using the fetcher. It is useful for queryClient.fetchQuery and queryClient.prefetchQuery.” And the provided sample await queryClient.prefetchQuery(userQuery.getKey(), () => userQuery.fetcher())

In setting up the SSR for Next, this doesn’t actually make any requests but instead populates a dehydrated state with a query hash and key and no data.

Another interesting outcome is that arguments are ignored. So query.fetcher({ arg: value }) doesn’t do anything but a type error will be present if the query requires an argument.

Your Example Website or App

https://github.com/wsfuller/next-space-x

Steps to Reproduce the Bug or Issue

1. Pull down provided repo
2. yarn
3. yarn dev
4. localhost:3000

No data is pulled during SSR

Expected behavior

Would expect a pre-populated HTML document that accepts arguments when using the queryClient.prefetchQuery as per the documentation

Screenshots or Videos

Platform

• OS: macOS 12.4
• NodeJS: 16.14.2
• graphql version: 16.5.0
• @graphql-codegen/* version(s): cli: 2.7.0, typescript: 2.6.0, typescript-graphql-request: 4.4.11, typescript-operations: 2.4.2, typescript-react-query: 3.5.15

Codegen Config File

overwrite: true
schema: "https://api.spacex.land/graphql/"
documents: "./src/graphql/**/*.gql"
generates:
  src/graphql/generated/index.ts:
    plugins:
      - typescript
      - typescript-operations
      - typescript-react-query
    config:
      pureMagicComment: true
      exposeQueryKeys: true
      fetcher: # note have tried setting this to graphql-request and continues to fail
        endpoint: "https://api.spacex.land/graphql/"
        fetchParams:
          headers:
            Content-Type: "application/json"
      exposeFetcher: true

Additional context

No response

[wsfuller]

Still looking into this but it seems like the exposeFetcher docs maybe incorrect.

Docs (not working): await queryClient.prefetchQuery(userQuery.getKey(), () => userQuery.fetcher())

Updated (working): await queryClient.prefetchQuery(userQuery.getKey(), userQuery.fetcher())

As far as using fetchQuery in place of prefetchQuery not seeing an issue. I’ve included a working repo in my original comment, I’m wondering if your error is stemming from something else. Changing the fetcher end point is a FetchError, so I’m curious if code generation didn’t run properly for the Type Error

[RedFour]

Updated (working): await queryClient.prefetchQuery(userQuery.getKey(), userQuery.fetcher())

Does anyone know the correct syntax for prefetching, when fetcher is set to graphql-request? The generated useMyCustomQuery hooks do not have a fetcher() method.