Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save kenmori/b38f4fc82f55e184c2bd89ee2d9b1cfd to your computer and use it in GitHub Desktop.
Save kenmori/b38f4fc82f55e184c2bd89ee2d9b1cfd to your computer and use it in GitHub Desktop.
解決: Solution 「Invariant Violation: Could not find "client" in the context or passed in as a prop」

When you test for .test file using apollo. often occure below error.

Invariant Violation: Could not find "client" in the context or passed in as a prop. Wrap the root component in an <ApolloProv
ider>, or pass an ApolloClient instance in via props.

       5 | it('renders without crashing', () => {
       6 |   const div = document.createElement('div');
    >  7 |   ReactDOM.render(<App />, div);
         |            ^
       8 |   ReactDOM.unmountComponentAtNode(div);
       9 | });

To fix below code

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';

it('renders without crashing', () => {
  const div = document.createElement('div');
  ReactDOM.render(<App />, div);
  ReactDOM.unmountComponentAtNode(div);
});

you have to wrap with MockedProvider

import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import { MockedProvider } from 'react-apollo/test-utils'; //add!!!!!!!!!!!1

it('renders without crashing', () => {
  const div = document.createElement('div');
  ReactDOM.render(
  <MockedProvider>//add!!!!!!!!!!!
    <App />
  </MockedProvider>//add!!!!!!!!!!!
  , div);
  ReactDOM.unmountComponentAtNode(div);
});

good! have a nice day!!

 PASS  src/App.test.js
  ✓ renders without crashing (43ms)

Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        2.985s
Ran all test suites related to changed files.

Watch Usage: Press w to show more.

see: https://www.apollographql.com/docs/react/recipes/testing#mockedprovider

author-Twitter

github

blog

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment