Should be able to select option from input with datalist without using `.type`

Problem description

For UX and a11y requirement we use a combination of <input type='text'> + <datalist>.
To test this component we can trigger changes with user.type(...) which is one way the user can interact with the input.

However, the user can also select a value from the list by clicking on the available values displayed.
We would like this behaviour to be translated in our test by calling user.click on the option or .selectOptions on the component itself.
This is at the moment not possible with the user-event library.

Please find the corresponding code at https://codesandbox.io/s/sharp-rhodes-9hflxf

Suggested solution

To be able to select a <input type='text'> + <datalist> option with at least one of these :

• .click

await user.click(screen.getByRole('option', { hidden: true, name: 'Option value' }))

• .selectOptions (or a new .selectOption ?)

await user.selectOptions(screen.getByRole('combobox'), 'Second option')

Additional context

No response

Reproduce the datalist behavior in the linked CodeSandbox, then trace the user.click and user.selectOptions entry points described in the issue. Done means a text input with a datalist can select an option through at least one supported API and the resulting value change is observable in a test.