search

nvaccess / nvda

NVDA, the free and open source Screen Reader for Microsoft Windows
https://www.nvaccess.org/
Other
2.11k stars 637 forks source link

Number of Rows and Columns in HTML table not announced in focusable DIV #11284

Open chris-lehman opened 4 years ago

chris-lehman commented 4 years ago

I've discovered an issue with NVDA and HTML tables in Chrome, Firefox, IE, and every other browser I've tried. If the table is contained within a focusable DIV (tabindex set to 0), and there is any text inside the DIV before the table, then when the user uses the keyboard to focus on the DIV, the row and column announcement does not happen. The row and column announcement does happen on the initial page load, but not when the user focuses. The contents of the table itself are still ready by NVDA, but not the number of rows and columns, which is important, especially for complex tables.

If you remove the text in the DIV before the table so that the table element is the very first thing in the DIV, the row and column announcement happens as expected.

Steps to reproduce:

1) Browse to the following link with Chrome, Firefox, etc.: http://www.pb.uillinois.edu/test3.html 2) Let the page be fully read by NVDA. 3) Use the tab key to navigate to the DIV with the table in it so that the focus rectangle surrounds the DIV.

Actual behavior:

NVDA reads the table contents but not the number of rows and columns.

Expected behavior:

NVDA should announce the number of rows and columns in the table before reading the table contents.

System configuration

NVDA installed/portable/running from source:

NVDA installed

NVDA version:

2020.1

Windows version:

Windows 10 Enterprise N Version 1909

Name and version of other software in use when reproducing the issue:

Chrome 83.0.4103.106 Firefox 77.0.1 Internet Explorer 11

Other information about your system:

Other questions

Does the issue still occur after restarting your computer?

Yes

Have you tried any other versions of NVDA? If so, please report their behaviors.

Yes, same behavior.

If addons are disabled, is your problem still occuring?

No addons.

Did you try to run the COM registry fixing tool in NVDA menu / tools?

Yes

Adriani90 commented 4 years ago

cc: @jcsteh any suggestions from Firefox side? I've seen this issue quite often on websites when navigating with tab to any of the tables. cc: @ObjectInSpace maybe you have also some suggestions reg. specifications for tables contained in div elements and how they are exposed in Google Chrome?

jcsteh commented 4 years ago

This is not a browser thing; the browser exposure doesn't change in this case. My guess is that NVDA chooses not to read table coordinates for reason focus. IMO, relying on an entire section of the page being read when you tab to it is a very strange use case, but I'll leave it to core devs to determine whether this is a use case they want to support.

chris-lehman commented 4 years ago

Thanks for checking into it. What convinced me to report it as an issue is that NVDA will announce the rows and columns just fine if the table is the very first thing in the div. If there is even a single character of text or a single HTML element such as a line break, then row/column announcement will not happen.

It may seem like an unusual use case to have a section read when focusing, but it's one that comes up often when using AJAX and jQuery to dynamically update page content based on user selection. I tried using ARIA live regions instead, but found the browser support too inconsistent, especially since I have to support older browsers in my work. Focusing on an element after content has changed is fully supported in every browser I've tried.

I hope this helps provide some useful context for motivating a fix. Thanks!

Adriani90 commented 4 years ago

cc: @feerrenrut

chris-lehman commented 3 years ago

Any updates on this? Thank you.

chris-lehman commented 3 years ago

@jcsteh I tried this again on NVDA 2020.4, and it's still not announcing the number of rows/columns in a table in a focusable DIV when tabbing to focus or setting focus dynamically with JavaScript. I just tried the same test page (http://www.pb.uillinois.edu/test3.html) with JAWS and JAWS announced the number of rows/columns just fine when tabbing to focus.

I find it really strange that if I remove any text before the table in the div with tabindex=0 that NVDA will announce the rows/columns just fine. Unfortunately, I have plenty of use cases where I need a bit of text before the table. I've tried wrapping the text before the table in all sorts of different HTML tags to see if I can trick NVDA into reading the table normally, but I haven't had any luck.

Any suggestions for a workaround?