'How come react query isn't working for my select box for my react-testing-library?

I am getting an error no matter what query I use in React-Testing Library. Whether it's getByText, or getByRole, or as seen in the the code example below getByDisplayValue, I get an error saying unable to find element with the ____ of 1

(The Current error: unable to find element with the display value of ..... )

DropdownInputTest.jsx

 test('renders select option value', async () =>
 {render(<DropDownInput data-testid='1' label='label 1' placeholder='1' options='1' 
  defaultValue='1' value='1'/>)

  const dropdownElement = screen.getByDisplayValue('1');
  expect (dropdownElement).toBeInTheDocument();
  }) 

DropdownInput.jsx

 <div className="on-demand-input-parameter">
  <Select
    data-testid={'1'}
    id={props.inputParameter.parameterId}
    label={props.inputParameter.name}
    placeholder={placeholder}
    onChange={(e) => optionSelected(e)}
    options={props.inputParameter.options}
    defaultValue={props.inputParameter.defaultValue}
    value={props.inputParameter.options.value}
  />
  </div>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source