React 测试库中的 QuerySelectorAll？

Question

问题： 我有多个下拉菜单，我正在检查其中是否有任何一个打开。我如何在 React 测试库中做到这一点？（我正在浏览一堆 tabIndexes 并检查它们）

问题： container.querySelectorAll 在反应测试库中是不可能的。

代码：

it('should not expand dropdown for multiple view', () => {
    const { container } = render(
      getMockedComponent()
    )

    expect(container).toBeVisible()

    container
      .querySelector('div[tabindex]').forEach(eachAccordian => {
        expect(eachAccordian).toHaveAttribute('aria-expanded', 'false')
      })
 })

如何使用 React 测试库检查所有节点？

Answer 1

您可以通过使用querySelectorAll而不是 来做到这一点querySelector。

container
      .querySelectorAll('div[tabindex]').forEach(eachAccordian => {
        expect(eachAccordian).toHaveAttribute('aria-expanded', 'false')
      })

Answer 2

您可能想使用React 测试库查询而不是querySelector. queryAllBy也许应该可以满足您的需要，您可以在其中选择具有特定数据测试 ID 或角色的任何内容，并从那里检查它们的属性！