reactjs - Ant Design 和 React 测试库

标签 reactjs unit-testing testing antd react-testing-library

我最近开始使用 Ant Deisgn,并且非常喜欢使用它。

但是我似乎偶然发现了一个我很难解决的问题。

使用 react-testing-library 进行测试,我在测试一些 Ant Design 组件时遇到了麻烦。

原因之一是由于某些未知原因,某些组件(例如菜单、菜单项、下拉列表等)未呈现自定义属性 data-testid,因此无法针对特定的目标DOM 的元素。

这会降低测试的性能和准确性。

其他人是否偶然发现了同样的问题? 您是如何着手解决这个问题的?

对于这个问题,Ant Design 团队有什么可以做的吗?

最佳答案

data-testid 属性可配置为您想要的任何属性。

https://testing-library.com/docs/dom-testing-library/api-configuration

此外,只要您选择的库具有 ID 属性,您就可以执行以下操作:

  const {container} = render(<Foo />) ;
  const button = container.querySelector('#idValue'); // returns react element
  fireEvent.click(button);

P. S:移动编辑。请忽略格式

关于reactjs - Ant Design 和 React 测试库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58197804/

相关文章:

javascript - Redux- mapStateToProps 不工作

unit-testing - 带有 ngrx 的 angular 2 组件 - 运行单元测试时出错

ruby - 如何编写特定的 rspec 测试?需要建议...

testing - Fortran运行时错误: Bad value during integer read

java - 如何区分 "run all tests"和 "run just this test"?

javascript - HtmlWebpackPlugin 删除模板 div

javascript - 当我运行 react.js 代码时,我有这个错误说 "Cannot update a components while rendering a different component"

javascript - 在 ReactJS 上使用 Props 打开和关闭对话框?我的模式保持打开状态并且不关闭

javascript - 如何在 Jasmine/Angularjs 中对下拉列表进行单元测试

asp.net-mvc - 是否可以在 ASP.NET MVC 中对某些 AddModelError 结果进行单元测试?