Action Performed:
- Using Chrome+JAWS, open URL: staging.new.expensify.com
- Navigate and activate the '+ (New)' button.
- Navigate to the 'New chat' button.
- Navigate to the "John...", "Berna ...", "Lisbeth", etc. controls using the screen reader in the 'RECENTS' and 'CONTACTS' sections.
- Observe the screen reader announcement for controls.
Expected Result:
When a role is defined appropriately for the interactive element, the screen reader user will interact with the element effectively.
Actual Result:
Role are not defined for the "John...", "Berna ...", "Lisbeth", etc. controls using the screen reader in the 'RECENTS' and 'CONTACTS' sections. This made it difficult for screen reader users to access the functionality associated with it. Additionally, the label is not defined for the mentioned interactive element in the source code of the page.
Other occurrences:
Similar issue repro on PR #8008, #8499, #8436, #8897, #8409, #8852, #9132
Workaround:
Yes
Area issue was found in:
New chat
Failed WCAG checkpoints
4.1.2
User impact:
Screen reader users will not be made aware that these elements are buttons.
Suggested resolution:
Ensure that all the page functionality is available for all users irrespective of the device being used.
Apply the following changes:
- Specify role="button" for the 'div' element containing the "John...", "Berna ...", "Lisbeth", etc. controls using the screen reader in the 'RECENTS' and 'CONTACTS' sections..
Platform:
- Web
- iOS
- Android
- Desktop App
- Mobile Web
Version Number: 1.1.49-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
Reference link: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role
Issue reported by: Sumit
Action Performed:
Expected Result:
When a role is defined appropriately for the interactive element, the screen reader user will interact with the element effectively.
Actual Result:
Role are not defined for the "John...", "Berna ...", "Lisbeth", etc. controls using the screen reader in the 'RECENTS' and 'CONTACTS' sections. This made it difficult for screen reader users to access the functionality associated with it. Additionally, the label is not defined for the mentioned interactive element in the source code of the page.
Other occurrences:
Similar issue repro on PR #8008, #8499, #8436, #8897, #8409, #8852, #9132
Workaround:
Yes
Area issue was found in:
New chat
Failed WCAG checkpoints
4.1.2
User impact:
Screen reader users will not be made aware that these elements are buttons.
Suggested resolution:
Ensure that all the page functionality is available for all users irrespective of the device being used.
Apply the following changes:
Platform:
Version Number: 1.1.49-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
Reference link: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/button_role
Issue reported by: Sumit