accessible-menu icon indicating copy to clipboard operation
accessible-menu copied to clipboard

Accessibility: Submenu does not close when focus moves outside the menu area

Open shodoi opened this issue 4 months ago • 1 comments

Summary

In APG, when focus moves outside the navigation area while a dropdown is open in the Disclosure Navigation Menu, the open dropdown closes. However, this functionality does not work in accessible-menu. Disclosure Menu v4 Example

Steps to reproduce

What are the steps to reproduce this issue?

  1. Press the Enter Key to open a submenu
  2. Press the Tab Key to move focus away from the submenu or outside the navigation area
  3. The submenu remains open

Expected Behaviour

1st choice: Close the submenu when focus moves from the submenu to the next menu 2nd choice: Close the submenu when focus moves outside the navigation area while the submenu is open

Spec

https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/examples/disclosure-navigation/

If a dropdown is open and focus is inside the navigation region, pressing Esc will close the dropdown. Moving focus out of the navigation region also closes an open dropdown. Implementing this Esc behavior is necessary to meet the WCAG 2.1 1.4.13: Content on Hover or Focus criterion.

shodoi avatar Oct 17 '24 02:10 shodoi