Combobox: Shift + Home/End not working as expected

[justindmyers]

What package within Headless UI are you using?

@headlessui/react

What version of that package are you using?

v1.7.4

What browser are you using?

Chrome 107.0.5304.107 64-bit

Reproduction URL

The behavior can be seen on the Headless UI examples:
https://headlessui.com/react/combobox

Describe your issue

Using Shift + Home or Shift + End is not currently working to select text.

Briefly looking at the code: Home/End are both used for highlighting a selection within the combo box, but this is also preventing those keys from being used for selecting text with the Shift modifier.

Since using Shift + Home/End for selecting text within an <input /> is standard browser behavior, this functionality should still be available within the Combobox input field as well.

For reference: according to the W3C best practices for a Combobox, Home/End should be used for the input field but currently the keys are only used for navigating to the first/last selection in the popup, regardless of the popup being open/closed.

Home - Moves visual focus to the textbox and places the editing cursor at the beginning of the field.
End - Moves visual focus to the textbox and places the editing cursor at the end of the field.

[RobinMalfait]

Hey! Thank you for your bug report!
Much appreciated! 🙏

We've implemented the Home/End keys to similar libraries and other components.
This should be fixed by #2024, and will be available in the next release.

You can already try it using:

• npm install @headlessui/react@insiders.
• npm install @headlessui/vue@insiders.