Cannot get past column headers with NVDA

[aardrian]

I'm submitting a ... (check one with "x")

[X] bug report => see 'Providing a Reproducible Scenario'
[] feature request => do not use Github for feature requests, see 'Customers of ag-Grid'
[] support request => see 'Requesting Community Support'

Customers of ag-Grid

I am not a customer, but I am evaluating ag-Grid for a client, a potential ag-Grid customer.

Requesting Community Support

I understand this will be closed if inactive for one month. However, as a non-customer I have no other way to report bugs.

Providing a Reproducible Scenario

1. Go to the ag-Grid page promoting its accessibility.

2. Scroll to the bottom and find the only demo on the page, opening the Plunker in its own window (I provide that link for ease of accessing it, but still do step 1 so you have the latest ag-Grid-sanctioned accessible demo).

3. Using NVDA, navigate to the grid (typically by pressing T, though it does not always work for this demo).

4. Using Ctrl + Alt + left or right arrow, navigate the column headings to ensure you are in the grid.

5. From any column header, press Ctrl + Alt + down arrow to move into the next row (the first data row).

Current behavior
NVDA announces "Edge of table" instead of moving to the next row.

Expected behavior
I should move to the cell immediately below the column header, NVDA should announce it.

Please tell us about your environment:

• ag-Grid version: Whatever is the version in your live demo.

• Browser:

  • Firefox 69, NVDA 2019.2

• Language: Whatever is the language in your live demo.

[davis4acca]

Hi,

Your ticket has been flagged as in_zendesk, it means that we recognize this as an issue worth investigating so we have moved it to our official support channel for customers (zendesk)

We will carry on there with the investigation and we will update you as soon as possible.

Thanks

[davis4acca]

Hi,

Thank you for your email. We are aware of this issue and have a feature request in our backlog:

You can follow the status of feature requests, bugs and releases using our pipeline:
https://www.ag-grid.com/ag-grid-pipeline/

If you are an ag-Grid Enterprise Customer, please raise this in our Zendesk support system - contact info@ag-grid.com for access. This is our primary channel for Support.

This is the reference and summary of the relevant issue:

AG-2016
Improve Accessibility across the grid - ARIA, ADA...

[kiril-matev]

Hi @aardrian,

We've significantly improved accessibility since you reported this behavior.

You can verify that the use case you reported is now fully supported - using the NVDA keyboard shortcuts you can move from a column header into the grid rows in AG Grid..

Thank you for reaching out - we appreciate your time!

[aardrian]

@kiril-matev
I confirm I can get into the cell below the header. In that regard, the very specific issue I raised is now addressed.

But after I move down into the table, the cell in which I land does not respond to NVDA table navigation. If I go left or right (Ctrl + Alt + ← or Ctrl + Alt + →) then I hear "Edge of table". If I go down (Ctrl + Alt + ↓) then I am moved up to the column header.

If I just left arrow or right arrow (← or →) from a data cell then I move one cell to the left or right. When I press it again, then NVDA does the character navigation I expect.

If I Tab into the table, then I cannot move up or down a data row with NVDA table commands after dropping into a cell. I can only move left and right. I can move around with arrows or Tab, but then I have lost my NVDA navigation completely.

I see this uses a grid role. It should act like a grid (no tab-stops at all since a grid is a single tab-stop on a page).

So I don't believe the larger issue is addressed -- being able to move more than one cell deep in the table/grid.

Firefox 87, NVDA 2021.3.1

[kiril-matev]

Hello @aardrian!

Thanks for bringing up this point and giving me an opportunity to clarify this.

NVDA provide their own navigation shortcuts in order to navigate controls displayed in page. The NVDA keyboard navigation scheme makes assumptions about DOM element order. This works fine in cases where you have static content such as tables.

However, AG Grid is a highly dynamic element which uses row and column virtualization in order to support large dataset sizes without large memory use or large initial loading time. Also, AG Grid uses a number of additional elements to display pinned columns, detail grids (when using master-detail functionality), column menus, context menus, dynamic popup editors, etc. As these elements are created in the DOM at a later point, they don't appear in the DOM element order between the elements they appear between visually. This is why AG Grid provides its own custom keyboard navigation and manages focus internally.

When you're using the NVDA keyboard navigation shortcuts, you're using their own custom keyboard navigation scheme, it assumes it is handling focus itself. However, AG Grid manages focus internally using a different scheme to support its advanced features. This is why, for the time being for the reasons I discussed above, please use the ARROW keys to navigate AG Grid reliably instead of the NVDA shortcut keys.

In order to track this better, we have logged this requirement as a feature request here:
AG-4365 [Accessibility] Allow using NVDA shortcut keys to navigate the grid to work correctly across header and grid viewport

You can follow the status of feature requests, bugs and releases using our pipeline:
https://www.ag-grid.com/ag-grid-pipeline/

Now that this requirement is recorded in our backlog, we will soon close the GitHub issue because we will not update it when this feature is added in a future version of AG Grid. The best way to get an update on this item is to sign up for AG Grid new release notifications. Once a new AG Grid version is released, look for the item reference above (AG-XXXX) on the changelog page to see if it's resolved in that version:
https://www.ag-grid.com/ag-grid-changelog/

Thanks again for bringing this up with us - we appreciate your time!