`graphql.operation` cannot intercept the unnamed graphql

Environment

Name	Version
msw	0.35.0
browser	Chrome v93.0.4577.82
OS	MacOS v11.5.2

Request handlers

import { setupWorker, rest } from 'msw'

const worker = setupWorker(
  graphql.operation((res, req, ctx) => {
    // ...
  })
)

worker.start()

Actual request

import { request, gql } from "graphql-request";

const query = gql`
  {
    hero {
      name
      friends {
        name
      }
    }
  }
`;

request("/", query)

Current behavior

The handler didn’t work, and there is a warning in the console:

[MSW] Failed to intercept a GraphQL request at "POST /": unnamed GraphQL operations are not supported.

Consider naming this operation or using "graphql.operation" request handler to intercept GraphQL requests regardless of their operation name/type. Read more: https://mswjs.io/docs/api/graphql/operation    

Note that using rest.post is workable:

rest.post(/\//, (res, req, ctx) => {
   // ...
})

Expected behavior

The handlers should works.

Screenshots

Here is a reproducible codesandbox.

Finally, thanks for the fantastic library 🙌. MSW helps my daily work a lot! Please let me know if there is anything I can help with this issue.

[kettanaito]

Hey, @andykao1213. Thank you for reporting this!

We are aware of this issue and collaborating with @neilime who has already implemented a fix! Please await the next release.

[R4YM3]

For others who find this, i had this issue aswell. It did a mutation like this:

updateSomething(input: $input){
  foo
  bar
}

but it should have been:

mutation UpdateSomething($input: UpdateSomethingInput){
  updateSomething(input: $input){
    foo
    bar
  }
}

Regards