diff options
Diffstat (limited to 'testing/web-platform/tests/conformance-checkers/html-aria/author-requirements')
16 files changed, 440 insertions, 0 deletions
diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/567.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/567.html new file mode 100644 index 0000000000..3800104d52 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/567.html @@ -0,0 +1,20 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A <div> with role "button" followed by a modification to the value of "checkbox".</title> + <script> + function changeRole (/* Element */ element, /* String */ newRole) { + element.setAttribute ('role', newRole); + element.innerHTML = "This <div> has role '" + newRole + "'"; + } + </script> + </head> + <body> + <div role="button" id="test" tabindex="0" onclick="changeRole (this, 'checkbox');" onkeydown="changeRole (this, 'checkbox');">This <div> has role 'button'</div> + <p> + <button onclick="changeRole (document.getElementById ('test'), 'checkbox')" type="button">Change Role</button> + <button onclick="window.location.reload()" type="button">Reload Page</button> + </p> + </body> +</html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/568.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/568.html new file mode 100644 index 0000000000..d290ada24c --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/568.html @@ -0,0 +1,32 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A <div> with role "button" followed by removal of the element and its children and an insertion of a new div having role="checkbox"</title> + <script> + function changeRoleByRemoval (/* Element */ element, /* String */ newRole) { + var parent = element.parentNode; + if (parent) { + parent.removeChild (element); + var div = document.createElement ('div'); + div.setAttribute ('role', newRole); + div.setAttribute ('id', 'test'); + div.setAttribute ('tabindex', '0'); + div.setAttribute ('onclick', 'changeRoleByRemoval (this, "checkbox");'); + div.setAttribute ('onkeydown', 'changeRoleByRemoval (this, "checkbox");'); + div.innerHTML = "This <div> has role '" + newRole + "'"; + parent.appendChild (div); + } + } + </script> + </head> + <body> + <div> + <div role="button" id="test" tabindex="0" onclick="changeRoleByRemoval (this, 'checkbox');" onkeydown="changeRoleByRemoval (this, 'checkbox');">This <div> has role 'button'</div> + </div> + <p> + <button onclick="changeRoleByRemoval (document.getElementById ('test'), 'checkbox')" type="button">Change Role</button> + <button onclick="window.location.reload()" type="button">Reload Page</button> + </p> + </body> +</html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/569.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/569.html new file mode 100644 index 0000000000..eca4e1f3e8 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/569.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A <div> with role role="listbox" aria-busy="true", but no "option" descendants.</title> + </head> + <body> + <div id="test" role="listbox" aria-busy="true"> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/571-haswarn.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/571-haswarn.html new file mode 100644 index 0000000000..92130fbf98 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/571-haswarn.html @@ -0,0 +1,84 @@ +<!DOCTYPE html> +<html><head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>In a <div> element with role="combobox" and aria-autocomplete="none", change values of the combobox by typing.</title> + <style> + .hasFocus { border: 2px solid red; } + </style> + <script> + var DEL = 8; + var BACK_SPACE = 72; + var comboInfo = {}; + + function initComboInfo() { + comboInfo.comboBox = document.getElementById ('test'); + comboInfo.textEntry = document.getElementById ('textEntry'); + var active = document.getElementById (comboInfo.comboBox.getAttribute ('aria-activedescendant')); + comboInfo.options = active.parentElement.children; + return active; + } + + function matchOption(/* String */ entryVal) { + var theOption = null; + + // Check only if entryVal is not empty. + // + if (entryVal != null && entryVal.length != 0) { + for (var i = 0; i < comboInfo.options.length; i++) { + var anOption = comboInfo.options[i]; + var optionText = anOption.innerHTML.toLowerCase(); + if (optionText.indexOf (entryVal) == 0) { + theOption = anOption; + break; + } + } + } + return theOption; + } + + function updateActive (/* Element */ newActive) { + var oldActive = document.getElementById (comboInfo.comboBox.getAttribute ('aria-activedescendant')); + if (oldActive != newActive) { + comboInfo.comboBox.setAttribute ('aria-activedescendant', newActive.getAttribute ('id')); + oldActive.removeAttribute ('class'); + newActive.setAttribute ('class', 'hasFocus'); + } + } + + function doOnload() { + var active = initComboInfo(); + active.setAttribute ('class', 'hasFocus'); + comboInfo.textEntry.value = active.innerHTML; + comboInfo.textEntry.focus(); + } + + function handleTyping (event) { + /* NOTE: With respect to IE, assumes IE9 as per CR criteria (http://www.w3.org/WAI/ARIA/1.0/CR/implementation-report) */ + /* NOTE: Supports deletion only from the end of the text INPUT value */ + var stringSoFar = event.target.value; + + if (event.which == DEL || event.which == BACK_SPACE) + stringSoFar = stringSoFar.slice(0, stringSoFar.length-1); + else + stringSoFar = stringSoFar + String.fromCharCode (event.which); + + var matchedOption = matchOption (stringSoFar.toLowerCase()); + if (matchedOption != null) + updateActive (matchedOption); + } + + </script> + </head> + <body onload="doOnload();"> + <div id="test" role="combobox" aria-expanded="true" aria-label="Tag" aria-autocomplete="none" aria-activedescendant="o1"> + <input id="textEntry" role="textbox" aria-owns="owned_listbox" onkeypress="handleTyping(event);" type="text"> + <ul role="listbox" id="owned_listbox" style="list-style-type: none;"> + <li role="option" id="o1">Zebra</li> + <li role="option" id="o2">Zoom</li> + <li role="option" id="o3">Zeta</li> + <li role="option" id="o4">Zaphod</li> + <li role="option" id="o5">Alpha</li> + </ul> + </div> + +</body></html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/572-haswarn.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/572-haswarn.html new file mode 100644 index 0000000000..358d14a617 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/572-haswarn.html @@ -0,0 +1,73 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>In a <div> element with role="combobox" and aria-autocomplete="inline", change values of the combobox by adjusting the up and down arrow keys with focus on the textfield in the combobox.</title> + <style> + .hasFocus { border: 2px solid red; } + </style> + <script> + var UP = 38; + var DOWN = 40; + comboInfo = {}; + + function toArray (/* NodeList */ nodeList) { + var result = []; + for (var i=0; i < nodeList.length; i++) { + result[i] = nodeList[i]; + } + return result; + } + + function initComboInfo() { + comboInfo.comboBox = document.getElementById ('test'); + comboInfo.textEntry = document.getElementById ('testEntry'); + var active = document.getElementById (comboInfo.comboBox.getAttribute ('aria-activedescendant')); + comboInfo.options = toArray (active.parentElement.children); + return active; + } + + function handleArrow (/* Event */ event) { + /* NOTE: With respect to IE, assumes IE9 as per CR criteria (http://www.w3.org/WAI/ARIA/1.0/CR/implementation-report) */ + var active = document.getElementById (comboInfo.comboBox.getAttribute ('aria-activedescendant')); + var currentIndex = comboInfo.options.indexOf (active); + var nextIndex = currentIndex; + if (event.which == DOWN) { + nextIndex = (currentIndex + 1) % comboInfo.options.length; + } + else if (event.which == UP) { + nextIndex = currentIndex - 1; + if (nextIndex < 0) + nextIndex = comboInfo.options.length - 1; + } + + if (nextIndex != currentIndex) { + active.removeAttribute ('class'); + active = comboInfo.options[nextIndex]; + comboInfo.comboBox.setAttribute ('aria-activedescendant', active.getAttribute ('id')); + active.setAttribute ('class', 'hasFocus'); + event.target.value = active.innerHTML; + } + } + + function doOnload() { + var active = initComboInfo(); + comboInfo.textEntry.value = active.innerHTML; + comboInfo.textEntry.focus(); + active.setAttribute ('class', 'hasFocus'); + } + + </script> + </head> + <body onload='doOnload()'> + <div id="test" role="combobox" aria-expanded="true" aria-label="Tag" aria-autocomplete="inline" aria-activedescendant="o1"> + <input id="testEntry" type="text" role="textbox" aria-owns="owned_listbox" onkeydown='handleArrow (event)'> + <ul role="listbox" id="owned_listbox" style="list-style-type: none;"> + <li role="option" id="o1">Zebra</li> + <li role="option" id="o2">Zoom</li> + <li role="option" id="o3">Zeta</li> + <li role="option" id="o4">Zaphod</li> + </ul> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/573-haswarn.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/573-haswarn.html new file mode 100644 index 0000000000..195dc7cdc0 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/573-haswarn.html @@ -0,0 +1,73 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>In a <div> element with role="combobox" and aria-autocomplete="both", change values of the combobox by adjusting the up and down arrow keys with focus on the textfield in the combobox.</title> + <style> + .hasFocus { border: 2px solid red; } + </style> + <script> + var UP = 38; + var DOWN = 40; + comboInfo = {}; + + function toArray (/* NodeList */ nodeList) { + var result = []; + for (var i=0; i < nodeList.length; i++) { + result[i] = nodeList[i]; + } + return result; + } + + function initComboInfo() { + comboInfo.comboBox = document.getElementById ('test'); + comboInfo.textEntry = document.getElementById ('testEntry'); + var active = document.getElementById (comboInfo.comboBox.getAttribute ('aria-activedescendant')); + comboInfo.options = toArray (active.parentElement.children); + return active; + } + + function handleArrow (/* Event */ event) { + /* NOTE: With respect to IE, assumes IE9 as per CR criteria (http://www.w3.org/WAI/ARIA/1.0/CR/implementation-report) */ + var active = document.getElementById (comboInfo.comboBox.getAttribute ('aria-activedescendant')); + var currentIndex = comboInfo.options.indexOf (active); + var nextIndex = currentIndex; + if (event.which == DOWN) { + nextIndex = (currentIndex + 1) % comboInfo.options.length; + } + else if (event.which == UP) { + nextIndex = currentIndex - 1; + if (nextIndex < 0) + nextIndex = comboInfo.options.length - 1; + } + + if (nextIndex != currentIndex) { + active.removeAttribute ('class'); + active = comboInfo.options[nextIndex]; + comboInfo.comboBox.setAttribute ('aria-activedescendant', active.getAttribute ('id')); + active.setAttribute ('class', 'hasFocus'); + event.target.value = active.innerHTML; + } + } + + function doOnload() { + var active = initComboInfo(); + comboInfo.textEntry.value = active.innerHTML; + comboInfo.textEntry.focus(); + active.setAttribute ('class', 'hasFocus'); + } + + </script> + </head> + <body onload='doOnload()'> + <div id="test" role="combobox" aria-expanded="true" aria-label="Tag" aria-autocomplete="both" aria-activedescendant="o2"> + <input id="testEntry" type="text" role="textbox" aria-owns="owned_listbox" onkeydown='handleArrow (event)'> + <ul role="listbox" id="owned_listbox" style="list-style-type: none;"> + <li role="option" id="o1">Zebra</li> + <li role="option" id="o2">Zoom</li> + <li role="option" id="o3">Zeta</li> + <li role="option" id="o4">Zaphod</li> + </ul> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/574.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/574.html new file mode 100644 index 0000000000..0edd82e91d --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/574.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A <div> with role="list" and a child div with role="group" who has a child of role="button".</title> + </head> + <body> + <div id="test" role="list"> + <div id="listChild" role="group"> + <span id="groupChild" role="button">List <abbr title="containing">→</abbr> group <abbr title="containing">→</abbr> button</span> + </div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/575.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/575.html new file mode 100644 index 0000000000..2672741683 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/575.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A <div>with role="menu" and a child div with role="group" who has a child of role="button"..</title> + </head> + <body> + <div id="test" role="menu"> + <div id="menuChild" role="group"> + <span id="groupChild" role="button">Menu <abbr title="containing">→</abbr> group <abbr title="containing">→</abbr> button</span> + </div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/576.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/576.html new file mode 100644 index 0000000000..25ac37ce26 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/576.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A <div> with role="tree" and a child div with role="group" who has a child of role="button"</title> + </head> + <body> + <div id="test" role="tree"> + <div id="treeChild" role="group"> + <span id="groupChild" role="button">Tree <abbr title="containing">→</abbr> group <abbr title="containing">→</abbr> button</span> + </div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/577.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/577.html new file mode 100644 index 0000000000..f08915bed2 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/577.html @@ -0,0 +1,14 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A <div> with role="grid" and a child div with role="rowgroup" who has a child of role="button".</title> + </head> + <body> + <div id="test" role="grid"> + <div id="gridChild" role="rowgroup"> + <span id="rowgroupChild" role="button">Grid <abbr title="containing">→</abbr> rowgroup <abbr title="containing">→</abbr> button</span> + </div> + </div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/578.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/578.html new file mode 100644 index 0000000000..2e781e3d04 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/578.html @@ -0,0 +1,11 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A page with two div elements that have role="toolbar" but not aria-label property.</title> + </head> + <body> + <div id="test" role="toolbar">Toolbar 1</div> + <div id="test2" role="toolbar">Toolbar 2</div> + </body> +</html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/579.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/579.html new file mode 100644 index 0000000000..fd2441ea6a --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/579.html @@ -0,0 +1,10 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A page with one div element that has role="toolbar" but not aria-label property.</title> + </head> + <body> + <div id="test" role="toolbar">Toolbar 1</div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/580.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/580.html new file mode 100644 index 0000000000..14a2c11bd2 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/580.html @@ -0,0 +1,24 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A div element with style="display:none" has aria-hidden="true", and then script sets style to "display: block".</title> + <script> + function replaceStyle (/* Element */ element, /* String */ selector, /* String */ newValue) { + element.setAttribute ('style', selector + ':' + newValue); + if (newValue == 'block') + element.setAttribute ('aria-hidden', 'false'); + else if (newValue == 'none') + element.setAttribute ('aria-hidden', 'true'); + } + </script> + </head> + <body> + <div id="test" aria-hidden="true" style="display:none;">This <div>'s style switched from 'display:none' to 'display:block'. It's <code>aria-hidden</code> was simultaneously switched to 'false'.</div> + <p> + <button onclick="replaceStyle (document.getElementById ('test'), 'display', 'block')" type="button">Change to 'display:block'</button> + <button onclick="replaceStyle (document.getElementById ('test'), 'display', 'none')" type="button">Change to 'display:none'</button> + <button onclick="window.location.reload()" type="button">Reload Page</button> + </p> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/581.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/581.html new file mode 100644 index 0000000000..bbe7143c50 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/581.html @@ -0,0 +1,12 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>A page with a div element with id="owned1" is referenced by two div elements that each have aria-owns="owned1".</title> + </head> + <body> + <div id="owner1" aria-owns="owned1">First owner of owned1</div> + <div id="owner2" aria-owns="owned1">Second owner of owned1</div> + <div id="owned1">I am owned1</div> + </body> +</html>
\ No newline at end of file diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/582.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/582.html new file mode 100644 index 0000000000..82a1f19981 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/582.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>An element with aria-setsize=5 has aria-posinset=6.</title> + </head> + <body> + <h2 id="label_fruit"> Available Fruit </h2> + <ul role="listbox" aria-labelledby="label_fruit"> + <li role="option" aria-setsize="5" aria-posinset="6" id="test"> apples </li> + <li role="option" aria-setsize="5" aria-posinset="2"> bananas </li> + <li role="option" aria-setsize="5" aria-posinset="3"> cantaloupes </li> + <li role="option" aria-setsize="5" aria-posinset="4"> dates </li> + <li role="option" aria-setsize="5" aria-posinset="5"> kumquat </li> + </ul> + </body> +</html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/584.html b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/584.html new file mode 100644 index 0000000000..e784d5be04 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/author-requirements/584.html @@ -0,0 +1,17 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <title>An element with aria-setsize=1 has aria-posinset=5</title> + </head> + <body> + <h2 id="label_fruit"> Available Fruit </h2> + <ul role="listbox" aria-labelledby="label_fruit"> + <li role="option" aria-setsize="1" aria-posinset="5" id="test"> apples </li> + <li role="option" aria-setsize="5" aria-posinset="2"> bananas </li> + <li role="option" aria-setsize="5" aria-posinset="3"> cantaloupes </li> + <li role="option" aria-setsize="5" aria-posinset="4"> dates </li> + <li role="option" aria-setsize="5" aria-posinset="5"> kumquat </li> + </ul> + </body> +</html> |