blob: 98105fbe9acc514be6c96d0ecfce7f21fc07029c [file] [log] [blame]
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../resources/js-test-pre.js"></script>
</head>
<body id="body">
<div id="toBeHidden">
<!-- textfields -->
<input type="text" id="textfield" data-expectedrequired="false">
<input type="text" id="textfield_required" required data-expectedrequired="true">
<input type="text" required aria-required="true" id="textfield_required_ariarequired" data-expectedrequired="true">
<input type="text" aria-required="false" id="textfield_ariarequiredfalse" data-expectedrequired="false">
<!-- these last ones conflict with implicit value of @required, so host language attr should win -->
<input type="text" aria-required="textfield_required_ariarequiredfalse" required id="textfield5" data-expectedrequired="true">
<!-- BLOCKED by http://webkit.org/b/119988
<input type="text" aria-required="true" id="textfield_requiredfalse_ariarequiredtrue" data-expectedrequired="false">
-->
<!-- checkboxes -->
<input type="checkbox" id="checkbox" data-expectedrequired="false">
<input type="checkbox" id="checkbox_required" required data-expectedrequired="true">
<input type="checkbox" required aria-required="true" id="checkbox_required_ariarequired" data-expectedrequired="true">
<input type="checkbox" aria-required="false" id="checkbox_ariarequiredfalse" data-expectedrequired="false">
<!-- these last ones conflict with implicit value of @required, so host language attr should win -->
<input type="checkbox" aria-required="false" required id="checkbox_required_ariarequiredfalse" data-expectedrequired="true">
<!-- BLOCKED by http://webkit.org/b/119988
<input type="checkbox" aria-required="true" id="checkbox_requiredfalse_ariarequiredtrue" data-expectedrequired="false">
-->
<!-- select -->
<select id="select" data-expectedrequired="false"><option>test</option></select>
<select id="select_required" required data-expectedrequired="true"><option>test</option></select>
<select required aria-required="true" id="select_required_ariarequired" data-expectedrequired="true"><option>test</option></select>
<select aria-required="false" id="select_ariarequiredfalse" data-expectedrequired="false"><option>test</option></select>
<!-- these last ones conflict with implicit value of @required, so host language attr should win -->
<select aria-required="false" required id="select_required_ariarequiredfalse" data-expectedrequired="true"><option>test</option></select>
<!-- BLOCKED by http://webkit.org/b/119988
<select aria-required="true" id="select_requiredfalse_ariarequiredtrue" data-expectedrequired="false"><option>test</option></select>
-->
<!-- textarea -->
<textarea id="textarea" data-expectedrequired="false"></textarea>
<textarea id="textarea_required" required data-expectedrequired="true"></textarea>
<textarea required aria-required="true" id="textarea_required_ariarequired" data-expectedrequired="true"></textarea>
<textarea aria-required="false" id="textarea_ariarequiredfalse" data-expectedrequired="false"></textarea>
<!-- these last ones conflict with implicit value of @required, so host language attr should win -->
<textarea aria-required="false" required id="textarea_required_ariarequiredfalse" data-expectedrequired="true"></textarea>
<!-- BLOCKED by http://webkit.org/b/119988
<textarea aria-required="true" id="textarea_requiredfalse_ariarequiredtrue" data-expectedrequired="false"></textarea>
-->
<!-- Custom ARIA controls (@required is not allowed on these elements, so no conflict resolution needed.) -->
<div tabindex="0" aria-required="true" role="listbox" id="listbox_ariarequiredtrue" data-expectedrequired="true">text</div>
<div tabindex="0" aria-required="false" role="listbox" id="listbox_ariarequiredfalse" data-expectedrequired="false">text</div>
<div tabindex="0" role="listbox" id="listbox" data-expectedrequired="false">text</div>
<div tabindex="0" aria-required="true" role="radiogroup" id="radiogroup_ariarequiredtrue" data-expectedrequired="true">text</div>
<div tabindex="0" aria-required="false" role="radiogroup" id="radiogroup_ariarequiredfalse" data-expectedrequired="false">text</div>
<div tabindex="0" role="radiogroup" id="radiogroup" data-expectedrequired="false">text</div>
<div tabindex="0" aria-required="true" role="spinbutton" id="spinbutton_ariarequiredtrue" data-expectedrequired="true">text</div>
<div tabindex="0" aria-required="false" role="spinbutton" id="spinbutton_ariarequiredfalse" data-expectedrequired="false">text</div>
<div tabindex="0" role="spinbutton" id="spinbutton" data-expectedrequired="false">text</div>
<div tabindex="0" aria-required="true" role="tree" id="tree_ariarequiredtrue" data-expectedrequired="true">text</div>
<div tabindex="0" aria-required="false" role="tree" id="tree_ariarequiredfalse" data-expectedrequired="false">text</div>
<div tabindex="0" role="tree" id="tree" data-expectedrequired="false">text</div>
</div>
<p id="description"></p>
<div id="console"></div>
<script>
description("This tests that aria-required is a usable attribute.");
if (window.accessibilityController) {
var result = document.getElementById('console');
var elements = document.querySelectorAll('[data-expectedrequired]');
result.innerText += "Elements to test: " + elements.length + "\n\n";
for (var i = 0, c = elements.length; i < c; i++) {
var el = elements[i];
var id = el.id;
var axElement = accessibilityController.accessibleElementById(id);
var isRequired = axElement.isRequired;
// Test whether elementis required.
var passed = el.dataset.expectedrequired === isRequired.toString();
var output = (passed ? "PASS" : "FAIL") + " " + id + " isRequired is " + isRequired;
if (!passed)
output += ", expected " + el.dataset.expectedrequired;
result.innerText += output + "\n";
}
}
document.getElementById('toBeHidden').hidden = true; // hide this to avoid text diffs when adding more elements to the test
</script>
<script src="../resources/js-test-post.js"></script>
</body>
</html>