Question

我是新来反应测试库的人，并且我热衷于使用酶。当我浏览文档时，我发现create-react-app允许直接包含第三方测试库。我尝试了以下方法来加入酶，但没有运气。这是我尝试过的方法，但无法在我的app.test.js中使用。

"browser": {
    "http": false,
    "https":false,
    "net": false,
    "path": false,
    "stream": false,
    "tls": false
}

我遇到以下错误：

import React from 'react';
import {configure, shallow} from 'enzyme'
import AboutPage from './AboutPage';

   describe('About us',() =>{
      it('About us content validation', ()=>{
      const wrapper = shallow(<AboutPage />);
      const textHeader = <p className="value-col-heading">EMPATHY</p>;
     expect(wrapper.contains(textHeader)).toEqual(true);
     });
    });

Answer 1

我看到您的错误很明显，因为您没有为酶设置任何适配器。 Enzyme是用于React的javaScript Testing实用程序，它使声明，操作和遍历React组件的输出变得更加容易。除此之外，还需要为其配置适配器，如下所示：您可以尝试一下，看看是否可行：

import React from 'react';
import {configure, shallow} from 'enzyme'
import Adapter from 'enzyme-adapter-react-16' // require your adapter from 
 here
import AboutPage from './AboutPage';
configure({adapter : new Adapter()}); // use configure to pass your adapter 
 object

describe('About us',() =>{
    it('About us content validation', ()=>{
        const wrapper = shallow(<AboutPage />);
        const textHeader = <p className="value-col-heading">EMPATHY</p>;
        expect(wrapper.contains(textHeader)).toEqual(true);
    });
})

Answer 2

与enzyme github's readme file (in installation part)中的情况一样您需要安装酶以及与react版本相对应的适配器。在您的情况下，您需要通过在应用程序的根目录中运行以下代码来安装酶-适配器-反应-16：

npm i --save-dev enzyme-adapter-react-16

之后，您需要配置酶以使用您要使用的适配器。为此，您可以像这样修改app.test.js：

import React from 'react';
import Enzyme, {configure, shallow} from 'enzyme';
import AboutPage from './AboutPage';
import Adapter from 'enzyme-adapter-react-16';

Enzyme.configure({ adapter: new Adapter() });

describe('About us',() =>{
  //what ever that was 
});

反应酶测试库

2 个答案: