Apollo GraphQL React - testing Mutations with MockedProvider

I'm following the docs provided by Apollo GraphQL for testing React component mutations using MockedProvider.

In the app I'm using recompose styled-components react apollo-client react-apollo For testing I use jest and enzyme

I have created mock queries using MockedProvider and tested my component successfully. I cannot, however, get the mutation testing to work properly. My component keeps displaying an error state for the HTML instead of displaying an OK state.

NOTE: Through compose, I compose my <TestKey/> component with handler functions and a loading and error state that will render conditionally.

Following the docs (linked above) I've created a test that looks similar to this:

COMPONENT

const Key = ({
  className,
  columns,
  title,
  data,
  type,
  onClick,
  paginate,
  error,
  info,
}) => (
  <div className={className}>
    <div className="tableHeader">
      <h4>{title}</h4>
      <Wrapper>
        <Tooltip
          title={`What are ${title}?`}
          content={[<TooltipContent key={title}>{info}</TooltipContent>]}
          trigger="hover"
          keyid={title}
        />
      </Wrapper>
      <Button type="primary" onClick={() => onClick(type)}>
        <ButtonIcon type="key" />
        Generate New Key
      </Button>
    </div>
    {error && <Alert type="danger">Error: {error}</Alert>}
    {data.length === 0 ? (
      <NoKeys>There are no {title} generated for this account.</NoKeys>
    ) : (
      <Table
        columns={columns}
        data={data}
        defaultSorted={[
          {
            id: 'insertedAt',
            asc: false,
          },
        ]}
      />
    )}
  </div>
)

MUTATION

const CREATEMUTATION = gql`
    mutation createKey(
      $type: String!
    ) {
      createKey(
        type: $type
      ) {
          id
          token
          type
          insertedAt
        }
      }
`

EXPECTED RETURN FROM MUTATION

const createKey = {
  id: '4',
  token: 'ucf345',
  type: 'public',
  insertedAt: '2018-06-20 20:42:15.189925',
}

TEST

describe('Create Key', () => {
    let tree

    beforeEach(async () => {
      const mockedData = [{
        request: {
          query: CREATEMUTATION,
          variables: { type: 'public' },
        },
        result: {
          data: {
            createKey: createKey,
          },
        },
      }]

      tree = renderer.create(
        <MockedProvider mocks={mockedData} removeTypename={true}>
          <ThemeProvider theme={theme}>
            <TestKey />
          </ThemeProvider>
        </MockedProvider>
      )
    })

****at this step in the test I should be able to call on the button in the component and trigger a click that calls the mutation****
    it('check', () => {
      //errors because it cannot find button
      const button = tree.root.findByProps({type: 'primary'})

      console.log(tree.toJSON().children);
    })
  })
})

CONSOLE.LOG RETURNS THE FOLLOWING IN THE TERMINAL (it displays what's rendered when my component receives an error from GraphQL)

[ { type: 'div',
        props: { className: 'sc-bwzfXH kIOmnc' },
        children: 
         [ [Object],
           'Error connecting to the Platform. Wait for a second and then click the retry button below' ] 
]

I've tried this using Enzyme's mount instead of React's Test renderer and I get the same result (an error state).