-
Notifications
You must be signed in to change notification settings - Fork 278
[ui5-tabcontainer]: ACC Issue - VoiceOver reads hidden overflow tabs in tab navigation #13360
Description
Bug Description
When the tab strip doesn't have enough space and some tabs are moved into the overflow ("More") menu, VoiceOver (iOS) still announces those hidden tabs during swipe navigation — as if they were visible in the tab strip. This is confusing for screen reader users because they hear tabs they cannot directly interact with in the current view.
Affected Component
ui5-tabcontainer
Expected Behaviour
VoiceOver should only announce visible tabs. Hidden tabs should only be accessible after activating the “More” button and opening the overflow menu.
Isolated Example
No response
Steps to Reproduce
- Render a ui5-tabcontainer with enough tabs to trigger the "More" overflow (e.g. 4+ tabs on a narrow screen)
- Enable VoiceOver (iOS) or NVDA/JAWS (desktop)
- Navigate the tab list with swipe gestures / arrow keys
- Observe that overflow tabs are announced even though they are not visible in the strip
Log Output, Stack Trace or Screenshots
No response
Priority
High
UI5 Web Components Version
Latest
Browser
Chrome
Operating System
Mobile
Additional Context
Root Cause Analysis
The overflow logic is handled entirely inside the ui5-tabcontainer shadow DOM. When a tab is moved into the overflow popover, no aria-hidden or inert attribute is applied to the corresponding tab element in the tab strip. Screen readers follow DOM order regardless of visual state, so they pick up all tabs.
The fix should live inside the TabContainer component itself — when a tab is shifted to overflow, it should be hidden from the accessibility tree (e.g. aria-hidden="true") in the tab strip, and restored when it becomes visible again.
Organization
SAP
Declaration
- I’m not disclosing any internal or sensitive information.