ReactTestUtils已被移动

时间:2017-04-11 00:39:48

标签: reactjs unit-testing react-test-renderer

我开始学习React,当我做一些测试时,我发现了两条警告信息:

  

警告:ReactTestUtils已移至react-dom / test-utils。更新引用以删除此警告。

     

警告:浅层渲染器已移至react-test-renderer / shallow。更新引用以删除此警告。

它们不会阻止测试运行,也不会阻止正确验证,但始终存在此错误。

通过查看文档,我found this page,即使在我列出他们推荐的那些内容之后,警告信息仍会显示。

我正在尝试一个非常简单的测试,这是我的代码:

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);
    })
})

为了解决此警告,我需要做什么?我已将所有打包更新到最新版本。

4 个答案:

答案 0 :(得分:21)

如果您使用React 0.14或React&lt; 15.5,除了酶之外,您还必须确保安装了以下npm模块(如果它们尚未安装):

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

如果您使用React&gt; = 15.5,除了酶之外,您还必须确保安装了以下npm模块(如果它们尚未安装):

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

答案 1 :(得分:16)

我认为它来自于使用来自酶的shallow渲染函数,该函数尚未针对v15.5进行更新(尽管它有pull request)。

您可以尝试使用其他渲染函数(rendermount)之一,但这会改变测试的语义(可能会也可能不会产生警告)。

您的另一个选择是不使用酶并使用react-test-renderer/shallow yourself,但酶API非常适合测试组件。

我的建议是等待酶的版本,并暂时接受警告。

答案 2 :(得分:1)

2017年8月更新

如果您安装react-test-renderer,它将有效,但所有react-*版本都应该匹配:

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

在我的环境中,只有这个配置有效!

答案 3 :(得分:0)

在尝试上面列出的步骤后,我仍然收到以下警告。

警告:ReactTestUtils已移至react-dom / test-utils。更新引用以删除此警告。

更新\ node_modules \ react-addons-test-utils \ index.js中的路径为我解决了这个问题。

旧:

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

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

新:

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

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