如何使用 React 测试库"find by element"



我是这个react测试库的新手,但我想做一些非常简单的事情,基本上找到HTML元素。

expect(screen.findByElemnet("div")).toHaveLength(5);

我可以在酶中很好地实现这一点,但在react测试库的API中没有任何东西表明我可以做到这一点。所有的findget函数似乎都是处理"角色"之类的事情。和";labels"。我不能在我正在测试的代码中使用这些。

我正在使用屏幕模块,因为我认为这是我从哪里做我所有的查询容器?

这种事情违背了项目的指导原则:

我们尝试只公开方法和实用程序,鼓励您编写与您的网页使用方式非常相似的测试。

这就是查询由标签、角色、可访问名称、文本等完成的原因。这些都是用户体验的一部分,对用户来说是有意义的。例如,可以引导用户点击"保存"按钮(screen.getByRole('button', { name: /save/i })),但不能使用实现细节来指导他们,这些细节可以在不影响用户体验的情况下进行更改。

最接近这些原则的逃生舱口是使用data-testid(参见:bytestd),这主要是寻找需要测试但不能通过文本,标签,角色等可靠地找到的特定元素的最后手段选项。

最新更新