Have a study of Material-UI's Autocomplete with the playground on https://material-ui.com/components/autocomplete/, I really cannot see any difference with/without includeInputInList property? The document says 'If true, the highlight can move to the input.' I tried it, highlight never move to the input field.
1 Answers
The includeInputInList has 2 associated unit tests.
The description of the tests says:
it considers the textbox the predessor of the first option when pressing Up
it considers the textbox the successor of the last option when pressing Down
This means that with includeInputInList, when you have the focus on the component and you press key up, if it's the first item, the focus will go to the textbox (the input element), before continuing on the items. And if you press down and it's the last item, the focus will also go to the textbox.
Without that option the focus stays on the displayed items and never goes to the textbox, it jumps from the first to the last item (key up), and from the last to the first (key down) while you have the focus on them and just press key up or key down.
You can try on the example provided on the Material UI docs: press tab until you are on the MUI component, and then play with key up or down, with and without the includeInputInList prop on the Autocomplete component.
Related