question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

MockedProvider - mutation errors are not passed to the component

See original GitHub issue

Hi, I have been facing a problem mocking data with MockedProvider. With queries all works as expected, when I mock success and errors, the problem comes with mutations, success are ok but when I try to mock an error it is not passed to my component in the render function, instead an Error is thrown.

Test:

 const mocks = [
        {
            request: {
                query: MY_MUTATION,
                variables: {
                    userId: 'error'
                },
            },
            error: new Error('boom!')
        }
];

it('my test that should pass', () => {

        const wrapper = mount(
            <MockedProvider mocks={mocks}>
                <MyComponent ... />
            </MockedProvider>
        );
...

Component:

 <Mutation mutation={MY_MUTATION} >
                {(cancelMandate, {loading, error}) => (
...

When I run the test it just throw the exception but in a live environment it is passed to the component!

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:9
  • Comments:9 (2 by maintainers)

github_iconTop GitHub Comments

8reactions
svalchinovcommented, Jan 17, 2020

We managed to get around it using errorPolicy if anyone else gets stuck:

<MockedProvider mocks={[mocks]} addTypename={false} defaultOptions={{
    mutate: {
        errorPolicy: "all"
    }
}}>
    <Component />
</MockedProvider>
2reactions
veddermaticcommented, Oct 16, 2019

I see the same, but in queries as well. Both of these:

{
  request: {
    query: MY_QUERY,
    variables: myVars
  },
  result: {
     errors: [new GraphQLError("Error!")],
  }
};

and

{
    request: {
      query: MY_QUERY,
      variables: myVars,
    },
    error: new Error('aw shucks'),
  };

Simply throw an error in Jest and fail the test. Using:

"@apollo/react-testing": "3.0.1",
"apollo-boost": "0.4.4",
"react-apollo": "3.0.1",
Read more comments on GitHub >

github_iconTop Results From Across the Web

Testing React components - Apollo GraphQL Docs
Using MockedProvider and associated APIs · The MockedProvider component · Testing the "loading" and "success" states · Testing error states · Testing mutations....
Read more >
apollo's MockedProvider doesn't warn clearly about missing ...
When this happens, MockedProvided returns a NetworkError to the component. However in the test suite, no warning is displayed. This is ...
Read more >
Errors when testing Apollo GraphQL in React — “No more ...
When testing graphql APIs the recommended practice according to React-Apollo is to use a MockedProvider to wrap your component.
Read more >
Testing Apollo: How to test if a mutation was called with ...
Support for testing components that use Apollo is very good for the most part. But still, some situations are confusing and not well…...
Read more >
Jest & Apollo Client: testing mutation error states
I wrote a test suite for this component, all of which worked correctly, until I got to the stage when I was testing...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found