If you spy on the useQuery hook, you won't know if there is a correct relationship present between the GraphQL query and the parameters passed to useQuery.

MSW ensures each query/mutation has the corresponding handler for the component. Otherwise, it throws an exception/warning that something is missing.

Also, if there is a contradiction between the variables in GraphQL query and useQuery variables, then the MSW handler will not receive the contradicting variables. It helps to identify that something is wrong with the communication between the GraphQL query and the React component using useQuery.

Mocking useQuery directly does not provide all the confidence that MSW provides.

Fullstack developer at Mercateo Gruppe