React-apollo: Mocking graphQLError with MockedProvider

[RodMachado]

Hi everyone, I need some help with testing!

I am trying to write an integration test for an container using MockedProvider wrapper.
Here's how I'm trying to set it up to return an error:

      const apolloError = new ApolloError({
        graphQLErrors: [new Error('insufficient funds')],
        networkError: null,
        errorMessage: 'GraphQL error: insufficient funds',
      });

      const mocks = [
        {
          request: {
            operationName: 'withdrawFromAccount',
            query: withdrawFromAccountMutation,
            variables: { _id: '123', value: 1000 }
          },
          error: apolloError
        }
      ]
      const container = mount(
        <MockedProvider mocks={mocks}>
          <WithdrawFromAccountContainer _id="123" />
        </MockedProvider>
      );

The mutation is triggered by a form submit and here's the function that handles the submit action:

onSubmit: props => async event => {
    try {
      event.preventDefault()
      const mutate = await props.mutate({
        variables: {
          _id: props._id,
          amount: props.amount,
        },
      })

      await props.setErrors([]);
      await props.setAmount('');
    }
    catch({ graphQLErrors }) {
      const errors = graphQLErrors.map(error => error.message);
      props.setErrors(errors);
    }
  }

Here's how the error looks like:

 {"graphQLErrors":[],"networkError":{"graphQLErrors":[{message: 'insufficient funds'}],"networkError":null},"message":"Network error: GraphQL error: insufficient funds"}

It appears that the ApolloError that I'm mocking is returning as a networkError, while the graphQLErrors array is empty.

Any ideas on how to get the ApolloError to be properly returned? Am I wrong in returning ApolloError on the mocked object?

Cheers!

• [email protected]
• [email protected]
• [email protected]
• [email protected]

[stale[bot]]

This issue has been automatically labled because it has not had recent activity. If you have not received a response from anyone, please mention the repository maintainer (most likely @jbaxleyiii). It will be closed if no further activity occurs. Thank you for your contributions to React Apollo!

[stale[bot]]

This issue has been automatically closed because it has not had recent activity after being marked as no recent activyt. If you belive this issue is still a problem or should be reopened, please reopen it! Thank you for your contributions to React Apollo!

[rzane]

@RodMachado, I'm having the exact same problem. It would be great to get an answer here, and ideally some better documentation for the MockedProvider.

[YoruNoHikage]

It's been a while but for anyone wondering, I found this on the documentation.

An error is passed as a networkError if a link further down the chain called the error callback on the observable. In most cases, graphQLErrors is the errors field of the result from the last next call.

const mocks = [
  {
    request: {
      operationName: 'withdrawFromAccount',
      query: withdrawFromAccountMutation,
      variables: { _id: '123', value: 1000 },
    },
    result: {
      errors: [],
    },
  },
]

should be the way to go !