-
Notifications
You must be signed in to change notification settings - Fork 3.7k
Description
Action Performed:
Prerequisite:
- the user is logged in
- Using JAWS + Chrome, open the page https://new.expensify.com/settings/profile
- Press Tab key to focus the buttons 'Scan receipt' and 'Start chat' at the bottom left corner.
- Note how the buttons are announced.
Expected Result:
When users navigate through the settings page, all interactive elements should be announced with a clear and descriptive name, e.g.:
- 'Scan receipt'
- 'Start chat'
Actual Result:
The buttons are announced with redundant text 'floating action':
- 'Scan receipt (Floating action)'
- 'Start chat (Floating action)'
HTML:
Area issue was found in:
Settings–Profile
Failed WCAG checkpoints
WCAG 2.4.6 Headings and Labels
https://www.w3.org/WAI/WCAG22/Understanding/headings-and-labels
User impact:
Descriptive headings are necessary for users who have disabilities that make reading slow and for people with limited short-term memory. These users benefit when section titles make it possible to predict what each section contains. Form input controls with labels that clearly describe the content that is expected to be entered helps users know how to successfully complete the form.
Suggested resolution:
Remove the redundant '(Floating Action)' text from the aria-label.
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label
Environment(s)
Windows Windows 10 - Chrome
Screenshots/Videos
Bug6994988_1762355629355.Buttons_announce_redundant_information__floating_action_.mp4
Version Number: NA
Reproducible in staging?: NA
Reproducible in production?: Yes
Email or phone of affected tester (no customers): NA
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/36605/community-issues/6994988
Issue reported by: NA
Slack conversation: NA