使用 react-testing-library 选择子组件答案

【问题标题】：Selecting child component with react-testing-library使用 react-testing-library 选择子组件
【发布时间】：2020-06-12 00:58:49
【问题描述】：

我可以使用 Enzyme 轻松选择子组件，但我想使用 react-testing-library。假设我有一个返回以下内容的组件：

return (
  <DropdownButton>
    <Dropdown.Item data-testid='x' key={id} />
  </DropdownButton>
)

截至目前，在测试中，我可以轻松地使用 const item = wrapper.find(Dropdown.Item) 选择 Dropdown.Item，但为什么我无法使用 react-testing-library 和 data-testid 通过 const { getByTestId } = render(<MyComponent />) 和 const item = getByTestId('x') 选择？

我应该使用不同的查询吗？

【问题讨论】：

测试库是围绕断言 end dom 而不是组件构建的。你要的是违反testing-librarytesting-library.com/docs/guiding-principles的原则
@johnnypeter 啊，所以我正在查看它不是的东西 - 感谢您的澄清！

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

【解决方案1】：

根据上面的评论，react-testing-library "...should deal with DOM nodes rather than component instances, and it should not encourage dealing with component instances"。我以错误的观点接近这个问题。

感谢 johnny peter 的澄清。

【讨论】：