Building an accessible combobox with ARIA

WHAT THIS TESTS The combobox is one of the hardest widgets to get right, so this question checks both the precise ARIA wiring and a nuanced understanding of two competing focus management strategies.

A GOOD ANSWER COVERS The text input carries role combobox, aria-expanded true or false to reflect whether the popup is open, aria-controls referencing the listbox id, and aria-autocomplete describing the suggestion behavior. The popup has role listbox and contains elements with role option, where the chosen one has aria-selected true. Now the key choice. With aria-activedescendant, DOM focus stays on the input the whole time; you set aria-activedescendant on the input to the id of the currently highlighted option, and you manage highlighting yourself. Arrow keys change which option id is referenced. With the alternative, you physically move DOM focus into the listbox options as the user arrows down, relying on native focus.

COMMON WRONG ANSWERS Mixing both models confuses screen readers about where focus is. Dropping aria-expanded means assistive tech cannot tell the list is open. Forgetting aria-controls breaks the announced relationship. Treating aria-selected and the active descendant as the same thing conflates selection with the current highlight.

LIKELY FOLLOW-UPS The trade-offs: aria-activedescendant keeps typing seamless because the caret stays in the input and is the standard choice for editable comboboxes, but you must manually manage scroll-into-view and styling of the active option. Moving DOM focus gives native focus behavior but complicates continued typing and requires returning focus to the input. How do you handle Escape, Enter, and Home or End? How does this differ for a select-only combobox?

ONE CONCRETE EXAMPLE An address autocomplete keeps focus in the input so the user keeps typing while arrowing through suggestions; aria-activedescendant points at the highlighted street, aria-expanded is true, and Enter commits it. Moving DOM focus into the list would interrupt typing, which is why activedescendant is preferred here.