用笑话测试隐藏字段的 presence/absence

Question

<div className="errorMsg" hidden={props.error === true ? false : true}>
  Error message text
</div>

我有这个 div 如果 props.Error 为假则隐藏，如果为真则显示。我正在尝试测试文本 does/doesn 是否根据道具值出现。由于我使用的是浅渲染，因此无论 hidden 是否为真，测试 expect(wrapper.find('.errorMsg').length).toEqual(1); 总是会通过。我正在使用浅渲染，因为这对我的其他测试是必要的，到目前为止我已经尝试过：

expect(wrapper.find('.garmentOriginErrorMsg').length).toEqual(0);
expect(wrapper.find('.errorMsg')).toHaveProperty('props', 'hidden: true')
expect(wrapper.find('.errorMsg').displayed()).toBeFalsy()
expect(wrapper.find('.errorMsg').hasStyle('display', 'none')).toBe(true)

浅层渲染是否可行，或者这是我使用挂载的唯一选择？

Answer 1

这应该适用于 shallow:

expect(wrapper.find('.errorMsg').props().hidden).toBe(true);

此外，props.error === true ? false : true可以简单地写成!props.error

用笑话测试隐藏字段的 presence/absence

Test for presence/absence of hidden field with jest

reactjs

unit-testing

jestjs

hidden-field