-
Notifications
You must be signed in to change notification settings - Fork 3.7k
Description
Action Performed:
Precondition: User is logged in
- Using VoiceOver on iOS or TalkBack on Android, open the app
- Swipe right to focus the Workspaces tab and double-tap to activate it
- Swipe right to focus any workspace container and note how it is announced
Expected Result:
Screen readers should announce all relevant workspace information, for example:
"Applause's Workspace, lol, applausetester+en@applause.expensifail.com, Collect Plan, Default, button".
Users must know the workspace title, owner, if it's the default one and plan type without relying on without visual cues.
Actual Result:
The container is announced simply as "Row, button".
None of the visible text (workspace title, owner name/email, plan type, default state) is included in the accessible name.
Users relying on screen readers cannot determine the workspace details or its content.
Area issue was found in:
Workspace
Failed WCAG checkpoints
WCAG 4.1.2 Name, Role, Value
https://www.w3.org/WAI/WCAG22/Understanding/name-role-value
User impact:
Providing role, state, and value information on all user interface components enables compatibility with assistive technology, such as screen readers, screen magnifiers, and speech recognition software, used by people with disabilities.
Suggested resolution:
Combine all relevant text into accessibilityLabel of the workspace container button to ensure it includes all relevant information.
Example:
"Applause's Workspace, lol, applausetester+en@applause.expensifail.com, Collect Plan, Default, button".
Refer to:
https://appt.org/en/docs/react-native/samples/accessibility-label
https://reactnative.dev/docs/accessibility#accessibilitylabel
Environment:
Apple iPhone 14 Pro - iOS 18.7.1, Wi-Fi - Native (No mobile browser)
Samsung Galaxy Note10 Plus - Android 12, H0T Mobile - Native (No mobile browser)
Screenshots/Videos
Bug7007086_1763522671806.Workspaces_have_non-descriptive_accessible_label__key_information_missing.mp4
Version Number: Production
Reproducible in staging?: NA
Reproducible in production?: Yes
Email or phone of affected tester (no customers): No
Logs: https://stackoverflow.com/c/expensify/questions/4856 NA
Notes/Photos/Videos: Any additional supporting documentation Yes
Expensify/Expensify Issue URL: https://platform.applause.com/company/12102/products/36628/community-issues/7007086
Issue reported by: NA
Slack conversation: NA