Summary: | AX: Headers of table not read by VoiceOver | ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Product: | WebKit | Reporter: | helene.vinh | ||||||||||
Component: | Accessibility | Assignee: | chris fleizach <cfleizach> | ||||||||||
Status: | RESOLVED FIXED | ||||||||||||
Severity: | Critical | CC: | aboxhall, apinheiro, cfleizach, commit-queue, dmazzoni, jcraig, jdiggs, mario, samuel_white, webkit-bug-importer | ||||||||||
Priority: | P2 | Keywords: | InRadar | ||||||||||
Version: | Safari 9 | ||||||||||||
Hardware: | All | ||||||||||||
OS: | OS X 10.9 | ||||||||||||
Attachments: |
|
Description
helene.vinh
2016-06-13 08:40:06 PDT
Created attachment 281188 [details]
Header row is zero sized
So it appears that the table headings not read when adorned with all the CSS is because they are essentially hidden, so they're skipped in the inclusion of the headers the table includes. However, the cell is able to see these headers, so I think ostensibly VoiceOver could fix this bug, or you can try to make sure that the header row is not zero sized Where should I look for the aria-hidden font icons? Not sure what you're referring to Thanks Hello Chris, Thanks for your quick answer. Actually the headers of the table are not hidden but placed off the screen by the following CSS: .plnext-sr-only { position: fixed; left: -999999px; } It is a technique that we use to add content for screen readers only, like additional instructions for example. I am not sure what else we can do about it. How much time do you think it will take VoiceOver team to fix it? For the font icons, you can try the top left calendar icon for example: <i aria-hidden="true" class="icon-calendar calendarmatrix-calendar-icon" title="calendar"></i> Also on each price cell, there is a tick icon which is displayed when the cell is selected: <i aria-hidden="true" class="icon-ok-sign calendarmatrix-sign-ok-icon" title="Selection"></i> Those are announced as "group ..." Thanks & regards (In reply to comment #4) > Hello Chris, > > Thanks for your quick answer. > > Actually the headers of the table are not hidden but placed off the screen > by the following CSS: > > .plnext-sr-only { > position: fixed; > left: -999999px; > } > > It is a technique that we use to add content for screen readers only, like > additional instructions for example. > I am not sure what else we can do about it. How much time do you think it > will take VoiceOver team to fix it? > > For the font icons, you can try the top left calendar icon for example: > <i aria-hidden="true" class="icon-calendar calendarmatrix-calendar-icon" > title="calendar"></i> > > Also on each price cell, there is a tick icon which is displayed when the > cell is selected: > <i aria-hidden="true" class="icon-ok-sign calendarmatrix-sign-ok-icon" > title="Selection"></i> > Those are announced as "group ..." On macOS Sierra (10.12) and/or the latest safari technology preview, I don't see this problem with the css::before content. It appears properly hidden and I don't hear VoiceOver announce a different group. A workaround idea would be to do something like <span aria-hidden="true"><i ...></I></span> So that the aria-hidden in on a higher level object > > Thanks & regards Hello, Thanks for your input. So with the latest version of MacOS, do you know if it is still relevant to add aria-hidden to font icons? For the initial issue about the headers, could you confirm it will be fixed by VoiceOver? Thanks & regards (In reply to comment #6) > Hello, > > Thanks for your input. > So with the latest version of MacOS, do you know if it is still relevant to > add aria-hidden to font icons? You mean latest released version? Or macOS Sierra? With macOS Sierra, no change is needed, it seems to work as expected > > For the initial issue about the headers, could you confirm it will be fixed > by VoiceOver? I'm still looking into this. I'm sure there is a work around, but it should also (probably) be fixed in WebKit. If during investigation there is a workaround I will post here > > Thanks & regards Hello, Is there any update for the webkit fix/ or workaround? Thanks & regards No update. Have you tested on Sierra yet? Hello, No, I don't have access to test with Sierra Regards Hello, Any update on this issue please? Thank you Hello, Any update on this issue please? Thank you have you tested with the latest macOS now that it's been released? Hello, Yes we tested on Sierra and the issue is still occuring. Could you please advise? Thanks (In reply to comment #14) > Hello, > > Yes we tested on Sierra and the issue is still occuring. > Could you please advise? > > Thanks Don't use position:fixed; left:-99999px; on the <th> tag when I remove that the table header becomes accessible. Hello, We use this CSS to make the headers invisible to sighted users. An alternative that we could do is use: position:fixed; opacity:0; Will it work that way or is it really the position:fixed that is causing the issue? Best regards (In reply to comment #16) > Hello, > > We use this CSS to make the headers invisible to sighted users. > An alternative that we could do is use: > > position:fixed; opacity:0; > Yes it does look like opacity:0 will fix the problem... thanks > Will it work that way or is it really the position:fixed that is causing the > issue? > > Best regards Actually, this might be an acceptable solution for desktop but could still cause issues on tablet. The text will still be displayed on the page (even invisible) and could be read by VoiceOver when navigating on it with touch. Is there any way that it will work by putting a smaller left value but still displaying the text outside of the screen? Best regards (In reply to comment #18) > Actually, this might be an acceptable solution for desktop but could still > cause issues on tablet. > The text will still be displayed on the page (even invisible) and could be > read by VoiceOver when navigating on it with touch. > > Is there any way that it will work by putting a smaller left value but still > displaying the text outside of the screen? > > Best regards Not sure, feel free to play around with values. My guess is no, but I could be wrong Created attachment 297319 [details]
patch
Attachment 297319 [details] did not pass style-queue:
ERROR: Source/WebCore/accessibility/AccessibilityTableColumn.cpp:172: Multi line control clauses should use braces. [whitespace/braces] [4]
Total errors found: 1 in 4 files
If any of these errors are false positives, please file a bug against check-webkit-style.
Comment on attachment 297319 [details] patch View in context: https://bugs.webkit.org/attachment.cgi?id=297319&action=review > Source/WebCore/accessibility/AccessibilityTableColumn.cpp:151 > + if (parentElement->hasTagName(trTag) && testCol < static_cast<int>(parentElement->children()->length())) Please use countChildNodes() instead of children()->length() in C++ code. > Source/WebCore/accessibility/AccessibilityTableColumn.cpp:152 > + testCellElement = parentElement->children()->item(testCol); Please use traverseToChildAt(i) instead of children()->item(i) in C++ code. > Source/WebCore/accessibility/AccessibilityTableColumn.cpp:175 > + AccessibilityObject* cellObject = axObjectCache()->getOrCreate(cell); > + if (cellObject && !cellObject->accessibilityIsIgnored()) > + return cellObject; > + > + return nullptr; WebKit coding style calls for early return. That would be reversed, like this: auto* cellObject = axObjectCache()->getOrCreate(cell); if (!cellObject || cellObject->accessibilityIsIgnored()) return nullptr; return cellObject; Created attachment 297760 [details]
patch
Attachment 297760 [details] did not pass style-queue:
ERROR: Source/WebCore/accessibility/AccessibilityTableColumn.cpp:172: Multi line control clauses should use braces. [whitespace/braces] [4]
Total errors found: 1 in 5 files
If any of these errors are false positives, please file a bug against check-webkit-style.
Comment on attachment 297760 [details] patch Clearing flags on attachment: 297760 Committed r210150: <http://trac.webkit.org/changeset/210150> All reviewed patches have been landed. Closing bug. Hello, Thank you for the fix. When will it be available? Do we get the patch by updating the Safari version? Thanks & regards Hello, Could you please give an answer to my question above? Also, will this fix be available on ipad? We are encountering the same issue on ipad version 10.3.1 Thanks & regards Apple doesn't pre-announce when releases will be available. The fix will come to iPad too |