pegasystems / constellation-ui-gallery

This open-source repository provides a collection of ready-to-use and customizable Constellation DX components. Use this resource to gain inspiration, best practices, and a solid foundation for implementing custom components.
https://pegasystems.github.io/constellation-ui-gallery/
Apache License 2.0
32 stars 23 forks source link

Radio button within CompareTable does not announce column heading as contextual label. #6

Closed vijayjangid closed 8 months ago

vijayjangid commented 8 months ago

Issue

Radio button used for selecting a column in compare table does not announce column heading as contextual label. Assistive technology used: Mac VoiceOver

compare-table-radio-accessibility

Steps to reproduce

  1. Press tab to focus on first select radio button in compare table.
  2. Observe screen reader announcement
  3. Screen reader announces Select, selected, radio button, 1 of 3
  4. Press 'right arrow' and the focus moves to next radio button in column 2. The announcement changes to Select, selected, radio button, 2 of 3
  5. As obsereved in step 3 and 4, only the Radio button label 'Select' is announced with no context about the column header in the table. This makes it inaccessible and difficult to figure out which item is being selected.