Не могу найти кнопку в библиотеке реагирующего тестирования с getByDisplayValueText

Question

У меня есть простой компонент, который имеет 3 кнопки. я хочу найти кнопки и симулировать щелчок, используя реагирующую библиотеку тестирования. проблема в том, что я не могу найти первую кнопку в моем тесте по приведенному ниже коду. учитывая, что у меня есть кнопка с value="All", а другая кнопка имеет "completed" в виде текста. Я могу найти вторую кнопку (я не могу изменить свой код для первой кнопки)

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('All')); ---> doesnt work

У вас есть .getByDisplayValue Текст и должно быть .getByDisplayValue (без «Текст»).

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

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