-
Notifications
You must be signed in to change notification settings - Fork 166
Description
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
- Navigate to
/
(the home page). - Switch to a mobile viewport (e.g., using device simulation in browser DevTools).
- Use the Tab key to focus the "menu" button (usually the third Tab stop).
- Press the Tab key again to move focus away from the "menu" button.
- 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