蚂蚁设计和React测试库

Question

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

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

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

原因之一是由于某些未知原因，某些组件（例如Menu，Menu.Item，Dropdown等）未呈现自定义属性data-testid，因此无法将DOM的特定元素作为目标。

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

是否有人偶然发现了同一问题？ 您如何解决这个问题的？

Ant Design团队是否可以解决此问题？

Answer 1

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：手机编辑。请忽略格式