Queries

You can intercept a GraphQL query by defining a graphql.query() handler for it and matching it by the operation name:

graphql.query('ListUsers', () => {
  return HttpResponse.json({
    data: {
      users: [
        { id: '1', name: 'John' },
        { id: '2', name: 'Kate' },
      ],
    },
  })
})

The request handler above will match the following GraphQL query made in your application:

query ListUsers {
  users {
    id
    name
  }
}

Reading raw query

You can access the query definition sent by the client via the query property of the response resolver’s argument:

graphql.query('ListUsers', ({ query }) => {
  console.log(query) // "query ListUsers { users { id name } }"
})

Reading the raw query is handy if you plan on resolving the mocked response from a different source, like a mocked GraphQL schema. You can learn more about that approach in the Schema-first mocking.