Bug 201887

Summary: AX: content with aria-hidden attributes is read in Safari by VoiceOver
Product: WebKit Reporter: Dean Hamack <hamackd>
Component: AccessibilityAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: andy.blum.01, npraskins, redux, tomasgobet, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari 12   
Hardware: Mac   
OS: macOS 10.14   
Attachments:
Description Flags
Sample page showing bug
none
Screenshot showing VO reading content behind modal overlay, and devtools showing it's in an aria-hidden="true" container none

Description Dean Hamack 2019-09-17 15:40:57 PDT
Created attachment 378999 [details]
Sample page showing bug

This bug was previously reported in bug #136071 and it still exists. Load the sample page in Safari and activate VoiceOver. Use the down arrow key to focus on the text content. The paragraph with the aria-hidden="true" attribute should not be read.

Safari 12.1.2 on MacOS Mojave 10.14.6
Comment 1 Radar WebKit Bug Importer 2019-09-17 15:41:10 PDT
<rdar://problem/55456956>
Comment 2 Patrick H. Lauke 2020-10-09 06:26:43 PDT
was about to post a new bug, but piggy-backing onto this: still an issue with Safari 14.0 on macOS Catalina 10.15.7 - noticed while testing the live demo http://edenspiekermann.github.io/a11y-dialog/example/ for https://github.com/edenspiekermann/a11y-dialog/

despite content being clearly contained inside an aria-hidden="true" block, it can be reached when using reading/cursor keys (see screenshot attached)

I have also observed the same problem (on a more complex page that uses a11y-dialog, but fundamentally does the same thing and hides everything but the dialog with aria-hidden="true") in iOS 14.0.1 / Safari (whatever version comes with that iOS version), where despite being in a dialog, user can swipe left/right and all of a sudden have content announced that is in the aria-hidden="true" page wrapping <div> (a few levels deep, but nonetheless a child element of a hidden container). the page in question is currently in staging, but will be in production (with the new a11y-dialog modal) next week https://www.babylonhealth.com/us/
Comment 3 Patrick H. Lauke 2020-10-09 06:27:44 PDT
Created attachment 410937 [details]
Screenshot showing VO reading content behind modal overlay, and devtools showing it's in an aria-hidden="true" container
Comment 5 Tomás García Gobet 2022-05-27 03:31:03 PDT
Can confirm it's still a thing in Safari 15.5.
Comment 6 Andy Blum 2022-09-01 11:46:12 PDT
I have additional evidence of Safari/VO not parsing things correctly.

Here's a codepen showing some cards in a carousel component where the carousel sets cards that are hidden from view as `inert` as well as `aria-hidden="true"`.

https://codepen.io/andy-blum/pen/zYjOMVN

Here's a video walkthrough of the issue.

https://youtu.be/ToPG80suly8