javascript - 使用 getByDisplayValue Text 在 react 测试库中找不到按钮

Question

我有一个简单的组件，有 3 个按钮。我想通过使用 react 测试库找到按钮并模拟点击。问题是我无法通过下面的代码找到测试中的第一个按钮。考虑到我有一个按钮值=“全部”另一个按钮的文本为“已完成”。我可以找到第二个按钮(我无法更改第一个按钮的代码)

document.body.innerHTML = `
<button value="All" />
<button>Completed<button/>
<button>in progress<button/>
<span>multi-test</span>
<div>multi-test</div>`;

screen.debug();
screen.debug(screen.getByDisplayValueText('All'));  ---> doesn't work
screen.debug(screen.getByText('Completed'));  ----> works 

Answer 1

screen.debug(screen.getByDisplayValueText('全部')); ---> 不起作用

您有 .getByDisplayValueText 并且应该有 .getByDisplayValue(不带“Text”)。

https://testing-library.com/docs/dom-testing-library/api-queries

getByDisplayValue(
  container: HTMLElement,
  value: TextMatch,
  options?: {
    exact?: boolean = true,
    normalizer?: NormalizerFn,
  }): HTMLElement