foundation-sites icon indicating copy to clipboard operation
foundation-sites copied to clipboard

[Accordion Menu] Keyboard Functionality Closes Submenu on Keydown

Open agbockus opened this issue 1 year ago • 0 comments
trafficstars

Expected Behavior

When accessing an accordion menu and tabbing through the submenus, a user should be able to (while having a submenu parent focused), press 'Space' or 'Enter' and open the submenu - where it should stay open so a user can explore the menu.

Current Behavior

When a submenu parent is focused and I press 'space' or 'enter', the submenu opens and then the entire menu collapses - leaving the focus inside the now-hidden submenu.

Possible Solution

Assuming that the accordion menu JavaScript functionality will need to be tested and fixed to account for submenu link functionality.

Test Case and/or Steps to Reproduce (for bugs)

How to reproduce:

  1. Go to https://get.foundation/sites/docs/accordion-menu.html#basics
  2. Tab into the basic accordion menu example at the bottom of this section, moving focus to 'Item 1'.
  3. With 'Item 1' focused, press 'Space' or 'Enter'.
  4. Tab into the submenu - focusing on 'Item 1A'.
  5. With 'Item 1A' focused, press 'Space' or 'Enter' - this is where the submenu expands and entire menu then proceeds to collapse.

Context

This breaks expected keyboard functionality and may interfere with accessibility.

Your Environment

  • Foundation version(s) used: 6.8.1
  • Browser(s) name and version(s): Chrome 127.0.6533.100
  • Device, Operating System and version: MacBook Pro, macOS Sonoma, 14.5 (23F79)
  • Link to your project: N/A - Foundation's Website

Checklist

  • [x] I have read and follow the CONTRIBUTING.md document.
  • [x] This is a bug report or a feature request.
  • [x] There are no other issues similar to this one.
  • [x] The issue title and template are correctly filled.

agbockus avatar Aug 12 '24 19:08 agbockus