Jest Enzyme 测试在 render 方法中返回 null 的 React 组件

IT技术 javascript reactjs jestjs enzyme
2021-05-11 03:26:47

我有一个组件在某些条件下在渲染中返回 null:

render() {
  if (this.props.isHidden) {
      return null;
  }

  return <div>test</div>;
}

当 isHidden 为真时,我想检查组件是否为空,并使用 jest 和酶:

describe('myComp', () => {
    it('should not render if isHidden is true', () => {
        const comp = shallow(<myComp isHidden={true} />);
        expect(comp.children().length).toBe(0);
    });
});

这有效,但有没有更惯用的方式来编写这个测试?测试呈现为 null 的组件是很常见的场景。

4个回答

ShallowWrapper有一个isEmptyRender()功能:

expect(comp.isEmptyRender()).toBe(true)
   expect(comp.type()).toEqual(null)

而已!

或者: expect(comp.get(0)).toBeFalsy()

根据ShallowWrapper::html实现,如果组件实例类型为 null,则返回 null,作为 的结果render

expect(comp.html()).toBeNull();

我们将以下内容与 jest-enzyme 一起使用

expect(comp).toBeEmptyRender()