{Linked:Bug214440; LinkedBug} [DOCS]: Incorrect name and no state is defined for the ‘Hamburger’ menu button. #4271
Description
What happened?
Incorrect name and no state are defined for the ‘Hamburger’ menu button, Screen reader is only announcing as ‘Menu button’.
How do we reproduce the behavior?
Repro steps:
- Open the URL: PWABuilder - Packaging for the Google Play Store in edge dev browser and login with v-.
- Turn on the narrator through Ctrl+ Windows+ Enter key.
- Navigate to the hamburger menu through tab key.
- Observe the issue.
What do you expect to happen?
Proper name and state should be defined for the ‘Hamburger’ menu button.
Screen reader should announce as ‘Hamburger menu’ button 'collapsed’ when it is in collapsed state and expanded when it is in expanded state.
What environment were you using?
Test Environment:
OS: Windows11
OS Version: 23H2 (Build 25905.1000)
Browser: Edge Dev (Version 117.0.2007.0 (Official build) dev (64-bit))
Screen reader: Narrator
Additional context
Notes:
Same issue repro at every pages.
User Impact:
Screen reader user will not be able to understand the purpose and its relationship with the content and hence will not be able to navigate or interact with it.
WCAG reference link:
Understanding Success Criterion 4.1.2: Name, Role, Value | WAI | W3C
Attachments:
Proper.name.and.state.is.not.announced.by.screen.reader.for.menu.button.mp4
