Closed
Description
What is the expected behavior?
The purpose fo the icons in the toolbar example must be conveyed to users of screen reader software.
What is the current behavior?
The purpose fo the icons in the toolbar example is not conveyed to users of screen reader software.
What are the steps to reproduce?
- Using either of the following screen readers
- NVDA 2018.4.1 + Firefox 64
- VoiceOver for IOS (12.1.3) + Safari
- Open the toolbar example
- Navigate to one of the icons in the toolbar example.
- In NVDA you can press the down arrow key until you reach an icon
- In VoiceOver for iOS you can swipe right until you reach an icon
- Observe that the icons cannot be reached
Which versions of Angular, Material, OS, TypeScript, browsers are affected?
- Angular Material Example 7.2.2 located at https://material.angular.io/components/
- NVDA 2018.4.1 + FireFox 64
- VoiceOver for IOS (12.1.3) + Safari (12.1.3)
Is there anything else we should know?
The example should demonstrate the use of accessible icons. If the icons are also meant to be actionable, they should be marked up as buttons.