508 compliance is required by my organization. There are several key places where aria-labels are missing from the Grid and some controls (buttons) are not keyboard accessible. Request to have these fixed so we do not have to try and apply hacks to achieve compliance.
aria-label needs to be applied in the following places:
- Grid Search Textbox
- Column Chooser
- Search textbox
- Column checkboxes
- Ok / Cancel buttons
- Grid Row Commands
- When edit or delete commands are applied to each row, the icons do not have aria-labels
When using the keyboard to navigate through the grid, there are some items that are either not accessible via the keyboard OR the user cannot tell where the focus is:
- Column Chooser
- when tabbing through the column chooser, there is no way to tell where the focus is, which column.
- Grid Search "Clear" button
- When a user tabs into the Grid Search input field, enters a search string, the "clear" button does appear, however, there is no way to get to it via the keyboard. As soon as the user presses the tab from the input field, the "clear" button disappears.
- The column filter is not keyboard accessible.
- When a column with custom actions is applied, these custom actions are not keyboard accessible. Keyboard focus passes over these actions, there is no way to get to them like there is with the built in "command" column.
https://stackblitz.com/edit/angular-tboaxk?file=src/index.html
https://angular-tboaxk.stackblitz.io