您如何使用Jest和react-testing-library测试元素的不存在?

我有一个要使用Jest和react-testing-library编写单元测试的组件库。基于某些道具或事件,我想验证是否未渲染某些元素。

getByText,,getByTestId等引发错误,react-testing-library如果找不到该元素,则会导致该expect函数触发之前测试失败

您如何使用react-testing-library测试是否在笑话中不存在?

GO2020/04/03 11:37:45

使用queryBy/ queryAllBy

正如你所说,getBy*getAllBy*如果没有找到引发错误。

但是,等效的方法queryBy*queryAllBy*而是返回null[]

查询

queryBy*查询返回查询的第一个匹配节点,null如果没有元素匹配则返回这对于声明不存在的元素很有用。如果找到多个匹配项,则抛出该异常(改为使用queryAllBy)。

queryAllBy queryAllBy*查询返回查询的所有匹配节点的数组,[]如果没有元素匹配,则返回一个空数组()。

https://testing-library.com/docs/dom-testing-library/api-queries#queryby

因此,对于您提到的特定两个,您将改为使用queryByTextqueryByTestId,但它们适用于所有查询,而不仅仅是这两个。