如何测试React组件的渲染HTML

时间:2019-05-30 18:06:55

标签: reactjs jestjs enzyme

我想在isPending:true时编写一个测试套件

render(){
const {onSearchChange, isPending } = this.props;
if(isPending){
  return(<h1>Loading</h1>    
  )
}else{
  return (
    <div className="App"> 
      <Scroll>
        <ErrorBoundry>
          <CardList robots={this.filteredRobots()}/>
        </ErrorBoundry>
      </Scroll>
    </div>
  )
}

}

下面是我编写的测试套件

it('return none when pending is true', () => {
const mockProps3 = {
    getRobots: jest.fn(),
    robots: [],
    searchField: '',
    isPending: true
}

const wrapper3 = shallow(<MainPage {...mockProps3} />);
//expect(wrapper3.equals(<h1>Loading</h1>)).to.equal(true);
expect(wrapper3.html()).to.equal('<h1>Loading</h1>');

})

但是在两种情况下都出现以下错误

TypeError:无法读取未定义的属性“等于”

1 个答案:

答案 0 :(得分:0)

尝试编写此测试

expect(wrapper3.find('h1').html()).toEqual('<h1>Loading</h1>')
})