AX: (iOS only) Some programmatic DOM changes are not noticed by VoiceOver

• Component: Accessibility
• Status: NEW ---

[Jonathan Deutsch]

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

[Radar WebKit Bug Importer]

<rdar://problem/29877887>

[James Craig]

Created attachment 298071 [details]
test case

[James Craig]

I can reproduce in iOS. Behavior is correct in macOS.

[Kim]

Is there any movement on this issue? We've been experiencing this issue on IOS 10+