kobalte icon indicating copy to clipboard operation
kobalte copied to clipboard

Accordion Keyboard behavior is broken

Open royeden opened this issue 9 months ago • 1 comments

Describe the bug

The Accordion component doesn't follow the correct WAI-ARIA specification that's advertised in the documentation. Specifically, the Keyboard interactions.

The following interactions are failing:

  • When using the arrow keys (ArrowUp/ArrowDown), Home and End, the focus is not being managed.
  • When using the Escape key, it always prevents default and stops the event, even if the Accordion is not collapsible. This is undocumented behavior of accordions closing on Escape and it also breaks accordions inside of Dialog components, for example.

To Reproduce

Bug reproduction demo

Steps to reproduce the behavior:

  1. Click the Trigger.
  2. Click an accordion trigger inside the modal.
  3. Press the Escape key, the modal isn't closed.
  4. Press arrow keys, Home, End and see no focus changes.
  5. See error.

Expected behavior

  • The arrow keys (ArrowUp/ArrowDown), Home and End should behave according to their spec.
  • If the Escape key behavior is kept, it should be documented and, ideally, you should be able to control how it handles the event instead of having an implicit event.

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

  • OS: Ubuntu 22.04
  • Browser: Chrome
  • Version: 132

royeden avatar Mar 23 '25 01:03 royeden

Yup, I get the same. The documentation for WAI-ARIA does provide that the arrow and home/end interactions are optional, but the Kobalte documentation implies that these interactions are supported (perhaps they were previously? perhaps in particular environments/conditions they are? unsure).

Image

Agreed wrt to the Escape button interactions.

Behaviour is also reproducible on the kobalte docs page. The issue doesn't exist with other components that have arrow key interactions.

Windows; Chrome

shayanhabibi avatar Sep 20 '25 05:09 shayanhabibi