我有一个组件在某些条件下在渲染中返回 null：
render() {
if (this.props.isHidden) {
return null;
}
return <div>test</div>;
}
我想用 jest 和酵素检查当 isHidden 为真时组件是否为空：
describe('myComp', () => {
it('should not render if isHidden is true', () => {
const comp = shallow(<myComp isHidden={true} />);
expect(comp.children().length).toBe(0);
});
});
这可行，但有没有更惯用的方法来编写这个测试？测试呈现为 null 的组件是很常见的场景。
【问题讨论】：
标签： javascript reactjs jestjs enzyme
expect(comp.type()).toEqual(null)
就是这样！
或：expect(comp.get(0)).toBeFalsy()
【讨论】：
mount 与 shallow 的人工制品，但这对我不起作用，我不得不按照 @shoaib-nawaz 的描述查看 comp.html()。
expect(comp.get(0)).toBeFalsy() 为我工作。 expect(comp.type()).toEqual(null)did 不是。
根据ShallowWrapper::html实现
如果组件实例类型为 null，则返回 null，这是 render 的结果。
expect(comp.html()).toBeNull();
【讨论】：
expect(comp.html()).to.eq('') 为我工作
comp.html() 在我的情况下返回了一个空字符串。
ShallowWrapper 有一个isEmptyRender() 函数：
expect(comp.isEmptyRender()).toBe(true)
【讨论】：
我们将以下内容与 jest-enzyme 一起使用
expect(comp).toBeEmptyRender()
【讨论】：
正如Benjamin Intal's solution 中提到的，我尝试使用myComponent.isEmptyRender()，但它意外返回false，即使myComponent.children().length 返回0。
问题原来是myComponent 来自对另一个浅渲染组件上的.find() 的调用。在这种情况下，需要在找到的子组件上额外调用 .shallow() 以使 isEmptyRender() 正常工作：
const parentComponent = shallow(<MyParentComponent isMyChildHidden={true} />);
const childComponent = parentComponent.find('MyChildComponent');
expect(childComponent.shallow().isEmptyRender()).toBe(true);
【讨论】：