ReactTestUtils has been moved

Question

I'm starting learning React and while I was doing some tests i noticed two warning messages:

Warning: ReactTestUtils has been moved to react-dom/test-utils. Update references to remove this warning.

Warning: Shallow renderer has been moved to react-test-renderer/shallow. Update references to remove this warning.

They don't prevent the tests from running nor from properly validating, but there is always this error.

By looking at the docs, I found this page, even after I included those lines they recommend, the warning message is still showing up.

I'm trying a very simple test to start with, this is my code:

import React from "react";
import toJson from "enzyme-to-json";
import { shallow } from "enzyme";
import { About } from "./About";

describe('Rendering test', () => {
    const component = shallow(<About />);
    const tree      = toJson(component);

    it('Should render the About component', () => {
        expect(tree).toMatchSnapshot();
    })

    it('Should not contain an h2 element', () => {
        expect( component.contains('h2') ).toBe(false);
    })
})

What do I need to do in order to solve this warnings? I already updated all my packaged to the latest versions.

Answer 1

I think it's coming from using the shallow render function from enzyme, which has not been updated for v15.5 yet (there is a pull request for it though).

You can try to use one of the other render function (render or mount), but this will change the semantics of your test (and may or may not still produce the warning).

Your other option is to not use enzyme and use react-test-renderer/shallow yourself, but the enzyme API is quite nice for testing components.

My advice is to wait for the version of enzyme and just live with the warning for now.

Answer 2

If you are using React 0.14 or React <15.5, in addition to enzyme, you will have to ensure that you also have the following npm modules installed if they were not already:

npm i --save-dev react-addons-test-utils react-dom

If you are using React >=15.5, in addition to enzyme, you will have to ensure that you also have the following npm modules installed if they were not already:

npm i --save-dev react-test-renderer react-dom

Answer 3

Update August of 2017

If you install react-test-renderer it will work but all react-* versions should match:

e.g.
react@15.4.2
react-test-renderer@15.4.2
react-dom@15.4.2
react-addons-test-utils@15.4.2

In my environment, only this config worked!

Answer 4

I was still receiving the following warning after trying steps listed above.

Warning: ReactTestUtils has been moved to react-dom/test-utils. Update references to remove this warning.

Updating the path in \node_modules\react-addons-test-utils\index.js solved this for me.

Old:

lowPriorityWarning(
  false,
  'ReactTestUtils has been moved to react-dom/test-utils. ' +
    'Update references to remove this warning.'
);

module.exports = require('react-dom/lib/ReactTestUtils');

New:

lowPriorityWarning(
  false,
  'ReactTestUtils has been moved to react-dom/test-utils. ' +
    'Update references to remove this warning.'
);

module.exports = require('react-dom/test-utils');