React 测试库：在 TestId 元素中获取子输入

Question

我有这样的结构：

<div data-test-locator="MyId">
    <input value="some" type="checkbox" checked />
</div>

我需要测试是否选中了复选框。但是我怎么能首先得到它呢？我可以得到一个带有这样的测试 id 的元素：getByTestId('MyId')但是我怎样才能得到它的子输入？

Answer 1

如果你知道结构不会改变，你可以使用 firstChild

expect((getByTestId('MyId').firstChild).checked).toEqual(true)

Answer 2

使用querySelector我们不需要知道结构：

const input = screen
  .getByTestId('MyId')
  .querySelector('input')

expect(input.checked)
  .toBeTruthy()