introspection query missing "OperationName": "IntrospectionQuery"

[dnlsandiego]

Hey ya'll. I just upgrade from v1.13 to the latest and I noticed that running the codegen with a config that points to a schema endpoint doesn't have a "OperationName": "IntrospectionQuery" params included in its payload anymore alongside the actual GraphQL introspection query query. Not sure if this is bug? or a misconfiguration on my config file?

[danielrearden]

The operationName parameter is optional and is only necessary when a request includes more than one operation. Since the request being sent contains only a single operation (the introspection query), there's no need for the operation name to be included.

[dnlsandiego]

Ah. That makes sense. Thanks for the quick reply! Is there any way I can intentionally include the operationName parameter for a single operation (introspection query)? Mainly using the operationName as a query identifier to bypass auth logic in the backend in local development when running the codegen.

[danielrearden]

Off-hand, I'm not sure if there's a way to do that. You might consider just sending a header like this. If you want to utilize an environment variable for the header value, you can use string interpolation:

schema:
  - http://localhost:3000/graphql:
      headers:
        X-Introspection: ${SOME_ENV_VALUE}

[dnlsandiego]

Ah yeah. I think headers will work instead. Thanks so much for your help!

[forgo]

Is it possible for the operation name to be re-introduced as a part of the request body (being undefined if it's not provided)?

We are leveraging Cypress for E2E tests, and their documentation for GraphQL lays out a way to leverage operation name to easily intercept and mock out specific GraphQL endpoints used for different purposes. Otherwise mocking because a nightmare.

See Cypress GraphQL docs for reference.

We are leveraging a codegen typescript-react-query plugin that let's us create a custom fetcher.

We could do a hacky parsing of the whole "query" string, and add a header as you suggested above, but this seems... not ideal.

The codegen already has logic to parse out this operation name and uses it for react query cache key (hard-coded) in codegen output.

Is there a plugin option for typescript-operations or typescript-react-query allowing to pass an additional parameter to my custom fetcher?

Otherwise, perhaps someone could point me in the direction of a utility that does this parsing that I can leverage and minimize unnecessary code footprint to set my custom header manually?

It feels like the operation name was removed inexplicably using codegen -- whereas it can be useful in the context of other tools like Cypress. Maybe I'm misunderstanding the reason why it was removed other than it being "optional". Having the ability to enforce an operation name would be great as it would be a great way to get a handle on intercepting specific requests.