Skip to content

[Menu] Menu list automatically expands on Tab key navigation but is not visible #915

@coseeian

Description

@coseeian

Title

[Menu] Menu list automatically expands on Tab key navigation but is not visible

Description

When using a mouse or keyboard to activate the "menu" button, the "menu list" panel expands and displays correctly.
However, when keyboard users navigate to the "menu" button (typically the third Tab stop) and then press the Tab key to move focus away, the "menu list" block automatically expands, but there is not enough space for it to be fully displayed on the screen. This prevents users from perceiving or interacting with the menu options, which poses a significant barrier for keyboard and assistive technology users.

Steps to Reproduce

  1. Navigate to / (the home page).
  2. Switch to a mobile viewport (e.g., using device simulation in browser DevTools).
  3. Use the Tab key to focus the "menu" button (usually the third Tab stop).
  4. Press the Tab key again to move focus away from the "menu" button.
  5. Observe that the "menu list" block automatically expands, but it is not fully visible due to insufficient screen space.

Actual Behavior

When the "menu list" panel expands automatically after moving focus away from the "menu" button using keyboard navigation, there is not enough space to display the panel. As a result, some or all menu options may be hidden or inaccessible.

Expected Behavior

The "menu list" panel should always be fully visible and accessible whenever it is expanded, whether triggered by mouse or keyboard click, or by automatic expansion. Its appearance and layout should match the behavior when the "menu" button is activated by mouse or keyboard clicking, with sufficient space to display all menu options.

Environments

No response

Suggested Fix

  • **Option 1(recommend):Do not automatically expand the "menu list" panel when focus leaves the "menu" button; instead, only expand the panel when activated by mouse or keyboard click.
  • **Option 2:Ensure that when the "menu list" panel is expanded automatically via keyboard navigation, its behavior matches that of expansion triggered by mouse or keyboard clicks, so the panel is always fully visible and accessible.

Reference

No response

What is your operating system?

None

Web browser and version

No response

Metadata

Metadata

Labels

Accessibility: Low SeverityMinor impact or no clear violation of a11y guidelines, but still a negative experience

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions