Question

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

如果props.Error为false，我将隐藏此div，如果为true，则将其显示。我试图根据道具价值测试文本是否出现。由于我使用的是浅层渲染，因此无论隐藏是否为真，测试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)

使用浅层渲染是否有可能，还是我使用mount的唯一选择？

Answer 1

这应该适用于shallow：

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

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

用玩笑来测试是否存在隐藏字段

1 个答案: