standards-support icon indicating copy to clipboard operation
standards-support copied to clipboard

Published 20 hours ago • verified publisher icon FreedomScientific

Inconsistent Live Region output depending on the fade-in method

Open JAWS-test opened this issue 6 years ago • 0 comments

Summary

Inconsistent Live Region output depending on the fade-in method

  1. Save as HTML file:
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>live region</title>
	</head>
	<body>
		<div role=alert id=1>
			content of live region
		</div>
		<h2>visibility:hidden</h2>
		<button onClick="document.getElementById('1').setAttribute('style','visibility:hidden');">hide</button>
		<button onClick="document.getElementById('1').removeAttribute('style');">show</button>
		<h2>display:none</h2>
		<button onClick="document.getElementById('1').setAttribute('style','display:none');">hide</button>
		<button onClick="document.getElementById('1').removeAttribute('style');">show</button>	
		<h2>aria-hidden</h2>
		<button onClick="document.getElementById('1').setAttribute('aria-hidden','true');">hide</button>
		<button onClick="document.getElementById('1').removeAttribute('aria-hidden');">show</button>	
		<h2>hidden</h2>
		<button onClick="document.getElementById('1').setAttribute('hidden','');">hide</button>
		<button onClick="document.getElementById('1').removeAttribute('hidden');">show</button>	
		
	</body>
</html>
  1. Activate all 8 buttons one after the other
  2. Insert a div inside the live region with id=1, remove id=1 from the outer div
  3. Save the HTML file again
  4. Activate all 8 buttons one after the other

Expected result

  • Live region is output with each of the 4 methods
  • Output should be consistent in all browsers
  • The output is consistent, independent of the method (role=alert or aria-live)
  • The output is consistent, regardless of whether the element itself or a child element is faded in.

Actual result

Different output depending on browser and method

See also https://github.com/w3c/aria-practices/issues/78 and many other problems with live regions: https://github.com/FreedomScientific/VFO-standards-support/issues?q=live+region

The live region is output as follows:

at the element

aria-live=polite
  • Firefox: always except aria-hidden
  • IE 11: never
  • Chrome: never
  • Edge: never
role=alert
  • Firefox: always except aria-hidden
  • IE: never
  • Chrome: always
  • Edge: never

at a child element

aria-live=polite
  • Firefox: always except aria-hidden
  • IE 11: never
  • Chrome: always
  • Edge: never
role=alert
  • Firefox: always except aria-hidden
  • IE 11: never except aria-hidden: with aria-hidden the live region is output 3x when fading out and 3x when fading in
  • Chrome: always
  • Edge: never

Additional Information

JAWS version and build number

JAWS 2019.1907.42

Operating System and version

Windows 10

Browser and version:

Chrome 76.0.3809.132 Firefox ESR 60.8.0 IE 11.1268.16299.0 Edge 16.16299

JAWS-test avatar Aug 30 '19 10:08 JAWS-test