Jest with webpack provide plugin

Question

I am using webpack-provide-plugin to import react.

new webpack.ProvidePlugin({
        "React": "react",
}),

// text.jsx

let text = (props) => (
  <div> 
    <p class="text">this.props.text</p>
  </div>
)

export default text 

//text.test.js

import React from 'react';
import { shallow } from 'enzyme';
import text from 'text';

it('Renders text', () => {
    const wrapper = shallow(<text/>);
    expect(wrapper.hasClass("text")).toEqual(true);
});

But while running react component tests with jest, I get the error

ReferenceError: React is not defined

Ofcourse, because react is not imported explicitly. Is there a way to this problem other than explicit imports and giving up on provide-plugin ?

Answer 1

You can create a setup file for Jest like this:

//jest.setup.js
window.React = require('react');

and add it to Jest config: "setupFiles": [ "<rootDir>/jest.setup.js" ], http://facebook.github.io/jest/docs/configuration.html#setupfiles-array