The issue I ran into is users are not notified how to open the column menu with just the keyboard. This is done with the CTRL and ENTER keys. If the user uses an accessibility application such as NVDA, there is no aria-label or aria-description to notify the user how to open it with the keyboard. Is this an ADA defect? Note that I added an aria-description myself and that resolved the issue for column headers that don't have the header checkbox. If the column header has a header checkbox, the aria-describedby prevents the aria-description and aria-label from being read. The aria-describedby: ag-29-input on the columnheader div doesn't appear to do anything and is also on the input for the checkbox. Setting aria-describedby to an empty string on the column header fixes the issue where aria-describedby: ag-29-input prevents aria-description and aria-label from being read on NVDA.
1 Answers
How does a sighted user know to press Ctrl+Enter? Are there any instructions for them?
I looked up some ag-grid examples on https://codesandbox.io/examples/package/ag-grid-react (because I wasn't familiar with it) and I ran the "AG Grid React with Key-Value Data" demo. The columns in the table had an aria-description of "Press CTRL ENTER to open column menu."
<div class="ag-header-cell ag-focus-managed" role="columnheader" tabindex="-1" aria-colindex="3" col-id="mealTime" aria-description="Press CTRL ENTER to open column menu.">
So the screen reader user will actually have an advantage over the sighted user because they'll hear the keyboard shortcut instructions. The sighted user won't have any instructions regarding the keyboard shortcuts.
I'm not sure if the person that created that demo added aria-description or if it's built into the ag-grid.
Note that aria-description isn't official yet. It's still in the AIRA 1.3 "Editor's Draft" spec. ARIA 1.1 is the current official spec and ARIA 1.2 is in the "Candidate Recommendation" phase. So I was surprised that the aria-description example worked with NVDA.
In any event, both sighted keyboard users and low vision or blind screen reader users both should be notified about the keyboard shortcut. If the user cannot navigate to the column header and open the menu, whether via a shortcut key or some other keypress, then yes, it would be an ADA issue. It would fail WCAG 2.1.1 Keyboard.
Related