feat: Add error handling to MockProvider

NickTomlin · Jun 21, 2019 · 9d6317b · 9d6317b
1 parent cc4dfdb
commit 9d6317b
Show file tree

Hide file tree

Showing 3 changed files with 71 additions and 7 deletions.
diff --git a/src/createApolloMockedProvider.tsx b/src/createApolloMockedProvider.tsx
@@ -7,6 +7,8 @@ import {
 } from 'graphql-tools';
 import ApolloClient from 'apollo-client';
 import { SchemaLink } from 'apollo-link-schema';
+import { ApolloLink } from 'apollo-link';
+import { onError } from 'apollo-link-error';
 import { ApolloCache } from 'apollo-cache';
 import { InMemoryCache } from 'apollo-cache-inmemory';
 
@@ -32,7 +34,7 @@ export const createApolloMockedProvider = (
   addMockFunctionsToSchema({ schema, mocks: customResolvers });
 
   const client = new ApolloClient({
-    link: new SchemaLink({ schema }),
+    link: ApolloLink.from([onError(() => {}), new SchemaLink({ schema })]),
     cache: cache || globalCache || new InMemoryCache(),
   });
 

diff --git a/test/createApolloMockedProvider.test.tsx b/test/createApolloMockedProvider.test.tsx
@@ -1,10 +1,17 @@
 import React from 'react';
 import { createApolloMockedProvider } from '../src';
 import { readFileSync } from 'fs';
-import { render, waitForDomChange, wait } from '@testing-library/react';
-import { GET_TODOS_QUERY, Todo } from './fixtures/Todo';
+import { render, wait, waitForDomChange } from '@testing-library/react';
+import {
+  GET_TODO_QUERY,
+  GET_TODOS_QUERY,
+  GetTodo,
+  GetTodos,
+  Todo,
+} from './fixtures/Todo';
 import path from 'path';
 import { InMemoryCache } from 'apollo-boost';
+import { Query } from 'react-apollo';
 
 const typeDefs = readFileSync(
   path.join(__dirname, 'fixtures/simpleSchema.graphql'),
@@ -52,6 +59,47 @@ test('works with custom resolvers', async () => {
   expect(getByText('Second Todo')).toBeTruthy();
 });
 
+test('allows throwing errors within resolvers to mock API errors', async () => {
+  const MockedProvider = createApolloMockedProvider(typeDefs);
+  const { container } = render(
+    <MockedProvider
+      customResolvers={{
+        Query: () => ({
+          todo: () => {
+            throw new Error('Boom');
+          },
+          todos: () => [
+            {
+              text: 'Success',
+            },
+          ],
+        }),
+      }}
+    >
+      <Query<GetTodos> query={GET_TODOS_QUERY}>
+        {({ data }) => (
+          <div>
+            {data && data.todos && data.todos.map(d => d.text)}
+            <Query<GetTodo> query={GET_TODO_QUERY} variables={{ id: 'fake' }}>
+              {({ error }) => {
+                if (error) {
+                  return <div>{JSON.stringify(error)}</div>;
+                } else {
+                  return <div>OKAY</div>;
+                }
+              }}
+            </Query>
+          </div>
+        )}
+      </Query>
+    </MockedProvider>
+  );
+
+  await waitForDomChange();
+  expect(container.textContent).toMatch(/Success/);
+  expect(container.textContent).toMatch(/GraphQL error: Boom/);
+});
+
 describe('caching', () => {
   test('allows users to provide a global cache', async () => {
     const cache = new InMemoryCache();

diff --git a/test/fixtures/Todo.tsx b/test/fixtures/Todo.tsx
@@ -12,6 +12,16 @@ export const GET_TODOS_QUERY = gql`
   }
 `;
 
+export const GET_TODO_QUERY = gql`
+  query getTodo($id: ID!) {
+    todo(id: $id) {
+      id
+      text
+      createdTs
+    }
+  }
+`;
+
 export const ADD_TODO_MUTATION = gql`
   mutation addTodo($input: AddTodoInput) {
     addTodo(input: $input) {
@@ -21,22 +31,26 @@ export const ADD_TODO_MUTATION = gql`
   }
 `;
 
-interface Todo {
+export interface Todo {
   id: string;
   text: string;
   createdTs: number;
 }
 
-interface Data {
+export interface GetTodos {
   todos: Array<Todo>;
 }
 
-interface AddTodo {
+export interface AddTodo {
   addTodo: Todo;
 }
 
+export interface GetTodo {
+  todo: Todo;
+}
+
 export const Todo = () => (
-  <Query<Data> query={GET_TODOS_QUERY}>
+  <Query<GetTodos> query={GET_TODOS_QUERY}>
     {({ loading, error, data }) => {
       if (loading) return <p>Loading...</p>;
       if (error) return <p>Error!</p>;