Bug 166714

Summary: AX: (iOS only) Some programmatic DOM changes are not noticed by VoiceOver
Product: WebKit Reporter: Jonathan Deutsch <jonathan>
Component: AccessibilityAssignee: Nobody <webkit-unassigned>
Status: NEW ---    
Severity: Normal CC: jcraig, webkit-bug-importer
Priority: P2 Keywords: InRadar
Version: Safari 10   
Hardware: iPhone / iPad   
OS: iOS 10   
Attachments:
Description Flags
test case none

Description Jonathan Deutsch 2017-01-04 21:28:00 PST
If the DOM is programmatically changed, these changes are not picked up by VoiceOver.

Example Code:

=====================

<div id = "item1">item 1 (not hidden)</div>
<div id = "item2" aria-hidden="true">item 2 (hidden via HTML)</div>
<div id = "item3">item 3 (hidden via JS after 2s)</div>
<div id = "item4">item 4 (not hidden)</div>

<script>

function changeHidden() {
	document.getElementById("item3").setAttribute("aria-hidden", "true");
} 

window.setTimeout(changeHidden, 4000);

</script>

=====================

After 4 seconds, item3 should no longer be navigable via swiping left/right in voice over because it is set to aria-hidden=true. However it still is.  Some actions like double-tapping will get it to be properly hidden from navigation.

Likewise, simply changing innerHTML may have the same result:

=====================

<div id = "item1">item 1 (not hidden)</div>
<div id = "output"></div>

<script>

function changeOutput() {
	output.innerHTML = "changed";
} 

window.setTimeout(changeOutput, 2000);

</script>

=====================

VO does not see the output div.

This affects dynamic sites, like those generated by Tumult Hype.

I am reproducing on iPad Pro with iOS 10.2.1 via:
1. Enabling VoiceOver
2. Swiping to the right
Comment 1 Radar WebKit Bug Importer 2017-01-04 21:28:12 PST
<rdar://problem/29877887>
Comment 2 James Craig 2017-01-05 00:06:23 PST
Created attachment 298071 [details]
test case
Comment 3 James Craig 2017-01-05 00:10:22 PST
I can reproduce in iOS. Behavior is correct in macOS.