diff options
| author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
|---|---|---|
| committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-07 09:22:09 +0000 |
| commit | 43a97878ce14b72f0981164f87f2e35e14151312 (patch) | |
| tree | 620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable | |
| parent | Initial commit. (diff) | |
| download | firefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip | |
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable')
5 files changed, 253 insertions, 0 deletions
diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-A.html b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-A.html new file mode 100644 index 0000000000..3ba81f2c16 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-A.html @@ -0,0 +1,52 @@ +<!DOCTYPE html> +<html><head> + <title>ARIA 1.0 Test Case: Listbox role with multiseclect</title> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + </head> + <body> + <h1>ARIA 1.0 Test Case: Listbox role with multiseclect</h1> + + <div role="listbox" aria-multiselectable="true"> + <div role="option">Option 1</div> + <div role="option" aria-selected="true" tabindex="-1">Option 2 (test for selected)</div> + <div role="option" aria-selected="false" id="ID_TARGET" tabindex="0">Option 3 (test for selected)</div> + <div role="option">Option 4</div> + </div> + + <h2>Description</h2> + <p>A DIV element with role role "listbox" has an aria-multiselect attribute set to "true". + Two of the four child "div" elements with the role "option" have the "aria-selected" attribute set + to "true".</p> + + <h2>Accessibility API Mappings</h2> + + <h3>MSAA + UIA Express</h3> + <p>Expose <code>STATE_SYSTEM_SELECTED</code>; Expose <code>STATE_SYSTEM_SELECTABLE</code></p> + + <h3>MSAA + IAccessible2</h3> + <p>Expose STATE_SYSTEM_SELECTED and STATE_SYSTEM_SELECTABLE for each of the elements with role option</p> + + <h3>UIA</h3> + <p>Expose IsSelected property in SelectionItem Control Pattern. The availability of the SelectionItem Control Pattern indicates the item is selectable.</p> + + <h3>ATK/AT-SPI</h3> + <p>Expose STATE_SELECTED on each of the elements with role option.</p> + + <h3>AXAPI</h3> + <p>AXSelected:Yes on option 2 and 3 and AXSelected:No on option 1 and 4</p> + + <script> + + function setFocus() { + var node = document.getElementById('ID_TARGET'); + +myVar=setTimeout(function(){var node = document.getElementById('ID_TARGET');node.setAttribute("aria-selected","true");} ,2000) + } + + window.addEventListener('load', setFocus); + </script> + + + + +</body></html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-B.html b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-B.html new file mode 100644 index 0000000000..6d1dcdaae7 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-B.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<html><head> + <title>ARIA 1.0 Test Case: Listbox role with multiseclect</title> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + </head> + <body> + <h1>ARIA 1.0 Test Case: Listbox role with multiseclect</h1> + + <div role="listbox" aria-multiselectable="true"> + <div role="option">Option 1</div> + <div role="option" aria-selected="true" tabindex="-1">Option 2 (test for selected)</div> + <div role="option" aria-selected="true" id="ID_TARGET" tabindex="0">Option 3 (test for selected)</div> + <div role="option">Option 4</div> + </div> + + <h2>Description</h2> + <p>A DIV element with role role "listbox" has an aria-multiselect attribute set to "true". + Two of the four child "div" elements with the role "option" have the "aria-selected" attribute set + to "true".</p> + + <h2>Accessibility API Mappings</h2> + + <h3>MSAA + UIA Express</h3> + <p>Expose <code>STATE_SYSTEM_SELECTED</code>; Expose <code>STATE_SYSTEM_SELECTABLE</code></p> + + <h3>MSAA + IAccessible2</h3> + <p>Expose STATE_SYSTEM_SELECTED and STATE_SYSTEM_SELECTABLE for each of the elements with role option</p> + + <h3>UIA</h3> + <p>Expose IsSelected property in SelectionItem Control Pattern. The availability of the SelectionItem Control Pattern indicates the item is selectable.</p> + + <h3>ATK/AT-SPI</h3> + <p>Expose STATE_SELECTED on each of the elements with role option.</p> + + <h3>AXAPI</h3> + <p>AXSelected:Yes on option 2 and 3 and AXSelected:No on option 1 and 4</p> + + <script> + + function clearSelection() { + myVar=setTimeout(function(){var node = document.getElementById('ID_TARGET');node.setAttribute("aria-selected","false");} ,3000) + } + + window.addEventListener('load', clearSelection); + </script> + + + + +</body></html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-C.html b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-C.html new file mode 100644 index 0000000000..88eb11bb41 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-listbox-multiselectable-C.html @@ -0,0 +1,64 @@ +<!DOCTYPE html> +<html><head> + <title>ARIA 1.0 Test Case: Listbox role with multiseclect</title> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <style> + [aria-selected="true"] { font-weight: bold; } + </style> + </head> + <body> + <h1>ARIA 1.0 Test Case: Listbox role with multiseclect</h1> + + <div role="listbox" aria-multiselectable="true"> + <div role="option">Option 1</div> + <div role="option" aria-selected="false" tabindex="-1">Option 2 (test for selected)</div> + <div role="option" aria-selected="false" id="ID_TARGET" tabindex="0">Option 3 (test for selected)</div> + <div role="option">Option 4</div> + </div> + <p><button onclick="toggleSelectedState();">Toggle Option 3 Selected State</button> + + <h2>Description</h2> + <p>A DIV element with role role "listbox" has an aria-multiselect attribute set to "true". + Two of the four child "div" elements with the role "option" have the "aria-selected" attribute set + to "true".</p> + + <h2>Accessibility API Mappings</h2> + + <h3>MSAA + UIA Express</h3> + <p>Expose <code>STATE_SYSTEM_SELECTED</code>; Expose <code>STATE_SYSTEM_SELECTABLE</code></p> + + <h3>MSAA + IAccessible2</h3> + <p>Expose STATE_SYSTEM_SELECTED and STATE_SYSTEM_SELECTABLE for each of the elements with role option</p> + + <h3>UIA</h3> + <p>Expose IsSelected property in SelectionItem Control Pattern. The availability of the SelectionItem Control Pattern indicates the item is selectable.</p> + + <h3>ATK/AT-SPI</h3> + <p>Expose STATE_SELECTED on each of the elements with role option.</p> + + <h3>AXAPI</h3> + <p>AXSelected:Yes on option 2 and 3 and AXSelected:No on option 1 and 4</p> + + <script> +/* + function setSelection() { + var node = document.getElementById('ID_TARGET'); + node.setAttribute("aria-selected","true"); + } + + window.addEventListener('load', setSelection); +*/ + function toggleSelectedState() { + var el = document.getElementById('ID_TARGET'); + if (el.getAttribute('aria-selected') == 'true') + el.setAttribute('aria-selected', 'false'); + else + el.setAttribute('aria-selected', 'true'); + } + + </script> + + + + +</body></html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-multiselectable-D.html b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-multiselectable-D.html new file mode 100644 index 0000000000..290430acf5 --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-multiselectable-D.html @@ -0,0 +1,41 @@ +<!DOCTYPE html> +<html><head> + <title>ARIA 1.0 Test Case: Listbox role with multiseclect</title> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + <style> + div[aria-selected="true"] {color:white;background-color:black;} + </style> + </head> + <body> + <h1>ARIA 1.0 Test Case: Listbox role with multiseclect</h1> + + <div role="listbox" aria-label="charlotte" aria-multiselectable="true"> + <div role="option" aria-selected="false" id="ID1" tabindex="-1" onclick="handle1(event)">Option 1 (test for click elected)</div> + <div role="option" aria-selected="false" id="ID2" tabindex="-1">Option 2</div> + <div role="option" aria-selected="false" id="ID3" onmousedown="handle2(event)">Option 3 (test for shift click selected)</div> + </div> + + <script> + function handle1(e) { + var node=document.getElementById('ID1'); + node.focus(); + e.stopPropagation(); + return false; + } + function handle2(e) { + shiftpressed=0; + shiftpressed=e.shiftKey; + if (shiftpressed){ + var node=document.getElementById('ID1'); + node.setAttribute("aria-selected", "true"); + node=document.getElementById('ID2'); + node.setAttribute("aria-selected", "true"); + node=document.getElementById('ID3'); + node.setAttribute("aria-selected", "true"); + } + e.stopPropagation(); + return false; + } + </script> + +</body></html> diff --git a/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-tree-multiselectable-C.html b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-tree-multiselectable-C.html new file mode 100644 index 0000000000..da97b2945f --- /dev/null +++ b/testing/web-platform/tests/conformance-checkers/html-aria/testcases-multiselectable/testcase-tree-multiselectable-C.html @@ -0,0 +1,46 @@ +<!DOCTYPE html> +<html><head> + <title>ARIA 1.0 Test Case: Tree role with aria-multiselectable</title> + <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> + </head> + <body> + <h1>ARIA 1.0 Test Case: Tree role with aria-multiselectable</h1> + + <div role="tree" aria-multiselectable="true"> + <div role="treeitem">Leaf 1 + <div role="group"> + <div role="treeitem" aria-selected="true">Leaf 1A (Selected)</div> + <div role="treeitem">Leaf 1B</div> + <div role="treeitem" aria-selected="false">Leaf 1C (aria-selected='false')</div> + </div> + </div> + <div role="treeitem" aria-selected="true">Leaf 2 (Selected) + <div role="group"> + <div role="treeitem">Leaf 2A</div> + <div role="treeitem">Leaf 2B</div> + <div role="treeitem">Leaf 2C</div> + </div> + </div> + <div role="treeitem">Leaf 3 + <div role="group"> + <div role="treeitem">Leaf 3A</div> + <div role="treeitem" aria-selected="false">Leaf 3B (aria-selected='false')</div> + <div role="treeitem" aria-selected="true">Leaf 3C (Selected)</div> + </div> + </div> + </div> + + <script> + + function setFocus() { + var node = document.getElementById('ID_TARGET'); + node.focus(); + } + + window.addEventListener('load', setFocus); + </script> + + + + +</body></html> |