'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 |
|---|
