Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Incorrect output of form fields within Live Regions (Chrome, Firefox) #269

Open
JAWS-test opened this issue Aug 31, 2019 · 0 comments
Open

Incorrect output of form fields within Live Regions (Chrome, Firefox) #269

JAWS-test opened this issue Aug 31, 2019 · 0 comments
Labels
aria-live-region

Comments

@JAWS-test
Copy link

Summary

Incorrect output of form fields within Live Regions (Chrome, Firefox)

  1. Save as HTML file:
<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>live region with form fields</title>
	</head>
	<body>
		<div role=status id=1></div>
		<button onClick="document.getElementById('1').innerHTML='<input title=title>';">input with title</button>
		<button onClick="document.getElementById('1').innerHTML='<button aria-label=arialabel>test with aria-label</button>';">button with aria-label</button>
		<button onClick="document.getElementById('1').innerHTML='<button aria-labelledby=3>test with aria-labelledby</button>';">button with aria-labelledby</button>
		<button onClick="document.getElementById('1').innerHTML='<input id=2 value=text>';">input with label outside</button>
		<button onClick="document.getElementById('1').innerHTML='<select title=title><option>1<option>2<option>3</select>';">select size=1</button>
		<button onClick="document.getElementById('1').innerHTML='<select size=3 aria-labelledby=3><option selected>4<option>5<option>6</select>';">select size>1</button>
		<button onClick="document.getElementById('1').innerHTML='<label><input type=checkbox> YES</label><label><input type=checkbox> NO</label>';">checkboxes</button>
		<button onClick="document.getElementById('1').innerHTML='<input type=submit>';">submit button</button>
		<label for=2>label outside</label>
		<span id=3>aria-labelledby outside</span>
	</body>
</html>
  1. Activate the buttons one after the other

Expected result

Form fields are output with their labels and values.

Actual result

  • IE: For most form fields, only the current value is output (input, select). With checkboxes and buttons, the label is output - not the visible one, but the correct one (e.g. aria-label, aria-labelledby).
  • Chrome: No output of content and labeling. Even the label of the checkboxes is not output. Only all list entries of select size>1 (even those not selected) are output.
  • Firefox: For input fields the value is output, for buttons the visible label is output (i.e. not aria-label or aria-labelledby). With checkboxes, the label is output twice. The select is not output at all in both variants.

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

Additional Information

JAWS version and build number

JAWS 2019.1907.42

Operating System and version

Windows 8

Browser and version:

Chrome 76.0.3809.100
Firefox 68.0.2
Internet Explorer 11.0.9600.19431
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
aria-live-region
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@stevefaulkner @JAWS-test