The Fifth Gap in a Custom Dropdown: Silent Selection Changes
In a custom dropdown, selecting an option silently updates the visual text on the trigger with no announcement — a screen-reader user gets no confirmation the selection changed unless they happen to re-focus the trigger and have it re-read.
What's the fix for this specific gap?
The correct answer is "aria-selected on the chosen option, plus an updated accessible name on the trigger."
The selected option needs aria-selected="true" within the list
(role="listbox" / role="option" on the items), and the trigger's
accessible name should update to reflect the new selection so it's
announced on the next interaction — some implementations pair this with
a live region for an explicit "X selected" announcement at the moment
of selection, rather than relying only on the next focus event.
Changing only the trigger's visual text, with no accessible-name update
or aria-selected state, is exactly the bug being described, not a fix
for it. A CSS-only highlight on the option is invisible to a screen
reader. Closing the dropdown faster doesn't address the missing
announcement at all.
Share this question