Description

User Impact:
Keyboard dependent users will find it difficult to identify the currently focused element if focus goes to hidden controls that are not visually appearing on page creating ambiguity for the user.

https://github.com/user-attachments/assets/b1a7fcc5-d359-4c97-a154-bc8d122739af
Image

Refer Attachment:

1. Keyboard focus is moving to the hidden elements present inside the collapsed hamburger menu.png
2. Keyboard focus is moving to the hidden elements present inside the collapsed hamburger menu.mp4

Expected behavior

Keyboard focus should not move inside the hamburger menu when it is in collapsed state. on pressing tab key keyboard focus should land on next interactive element in main page.

Actual behavior

Keyboard focus is moving to the hidden elements present inside the collapsed hamburger menu.

Steps to reproduce

1. Open the URL: https://docs.pwabuilder.com/#/builder/android in latest edge browser.
2. PWA Builder - packaging page will be displayed on screen.
3. Press tab key to reach 'Ham burger menu button' and collapse with enter key.
4. Now press tab key to 'Hamburger menu button'.
5. Verify using tab key whether keyboard focus is moving to the hidden elements present inside the collapsed hamburger menu button or not.

Environment

OS: Windows 11 Enterprise Insider Preview Version 24H2 (OS Build 26100.3775)
Browser Microsoft Edge Version 135.0.3179.85 (Official build) (64-bit)
URL: https://docs.pwabuilder.com/#/builder/android

Additional Information

• Bug still occurs when all/other plugins are disabled?