为什么 React 测试库不在 Dropdown 组件中呈现所有子项?

问题描述 投票:0回答:0

我正在使用 React 18,测试库和 react-bootstrap Dropdown 组件,并想模拟用户点击第二个下拉选项。

问题是当组件被渲染时,它并没有渲染 Dropdown item children.

如果我用 multiple 渲染一个非常基本的,我可以在 dom 中看到所有这些,但是当我使用下拉菜单组件时,例如

    <DropdownButton id="dropdown-basic-button" title="Dropdown button">
      <Dropdown.Item href="#/action-1">English</Dropdown.Item>
      <Dropdown.Item href="#/action-2">French</Dropdown.Item>
      <Dropdown.Item href="#/action-3">German</Dropdown.Item>
    </DropdownButton>
  );```

Then the dom only contains the following and I can never reach the item I wish to click:

``` <body>
      <div>
        <div>
          <div
            class="dropdown"
          >
            <button
              aria-expanded="false"
              class="dropdown-toggle btn btn-primary"
              id="dropdown-basic-button"
              type="button"
            >
              Dropdown button
            </button>
          </div>
        </div>
      </div>
    </body>

谁能解释这种行为?

谢谢。

reactjs jestjs react-bootstrap react-testing-library
© www.soinside.com 2019 - 2024. All rights reserved.