| <!DOCTYPE HTML> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <!-- Will set indeterminate state via JS --> |
| <input id="element1" type="checkbox" /> |
| <script> |
| // No way currently to do this via markup, must be via JS |
| document.getElementById("element1").indeterminate = true; |
| </script> |
| <!-- Control--> |
| <input id="element2" type="checkbox" /> |
| |
| <div> |
| <!-- Will be ::indeterminate in CSS because no radio item selected yet --> |
| <input type="radio" name="radiogroup1" /> |
| <input id="element3" type="radio" name="radiogroup1" /> |
| </div> |
| |
| <div> |
| <!-- NOT mixed/indeterminate because group has a selected radio button --> |
| <input id="element4" type="radio" name="radiogroup2" /> |
| <input id="element5" type="radio" checked name="radiogroup2" /> |
| </div> |
| |
| <input id="input-button" type="button"/> |
| <input id="input-button-false" type="button" aria-pressed="false"/> |
| <input id="input-button-mixed" type="button" aria-pressed="mixed"/> |
| <input id="input-button-true" type="button" aria-pressed="true"/> |
| <div id="aria-button" role="button">button</div> |
| <div id="aria-button-false" role="button" aria-pressed="false">button</div> |
| <div id="aria-button-mixed" role="button" aria-pressed="mixed">button</div> |
| <div id="aria-button-true" role="button" aria-pressed="true">button</div> |
| <button id="button">button</button> |
| <button id="button-false" aria-pressed="false">button</button> |
| <button id="button-mixed" aria-pressed="mixed">button</button> |
| <button id="button-true" aria-pressed="true">button</button> |
| |
| <script> |
| |
| function axElementById(id) { |
| return accessibilityController.accessibleElementById(id); |
| } |
| |
| test(function(t) { |
| var ax = axElementById("element1"); |
| assert_equals(ax.checked, "mixed"); |
| }, "A native indeterminate checkbox must have the mixed state"); |
| |
| test(function(t) { |
| var ax = axElementById("element2"); |
| assert_equals(ax.checked, "false"); |
| }, "A native checkbox that is not indeterminate" + |
| " must NOT have the mixed state"); |
| |
| test(function(t) { |
| var ax = axElementById("element3"); |
| assert_equals(ax.checked, "false"); |
| }, "A native radio that in a group with nothing checked" + |
| " must appear unchecked, not mixed"); |
| |
| test(function(t) { |
| var ax = axElementById("element4"); |
| assert_equals(ax.checked, "false"); |
| }, "A native radio that in a group with something checked" + |
| " must NOT have the mixed state"); |
| |
| test(function(t) { |
| var ax = axElementById("input-button"); |
| assert_equals(ax.checked, ""); |
| }, "<input type=button> does not set checked property"); |
| |
| test(function(t) { |
| var ax = axElementById("input-button-false"); |
| assert_equals(ax.checked, "false"); |
| }, "<input type=button aria-pressed=false> is not checked"); |
| |
| test(function(t) { |
| var ax = axElementById("input-button-false"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<input type=button aria-pressed=false> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("input-button-mixed"); |
| assert_equals(ax.checked, "mixed"); |
| }, "<input type=button aria-pressed=mixed> has checked state of mixed"); |
| |
| test(function(t) { |
| var ax = axElementById("input-button-mixed"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<input type=button aria-pressed=mixed> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("input-button-true"); |
| assert_equals(ax.checked, "true"); |
| }, "<input type=button aria-pressed=true> has checked state of true"); |
| |
| test(function(t) { |
| var ax = axElementById("input-button-true"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<input type=button aria-pressed=true> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("aria-button"); |
| assert_equals(ax.checked, ""); |
| }, "<div role=button> does not set checked property"); |
| |
| test(function(t) { |
| var ax = axElementById("aria-button-false"); |
| assert_equals(ax.checked, "false"); |
| }, "<div role=button aria-pressed=false> is not checked"); |
| |
| test(function(t) { |
| var ax = axElementById("aria-button-false"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<div role=button aria-pressed=false> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("aria-button-mixed"); |
| assert_equals(ax.checked, "mixed"); |
| }, "<div role=button aria-pressed=mixed> has checked state of mixed"); |
| |
| test(function(t) { |
| var ax = axElementById("aria-button-mixed"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<div role=button aria-pressed=mixed> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("aria-button-true"); |
| assert_equals(ax.checked, "true"); |
| }, "<div role=button aria-pressed=true> has checked state of true"); |
| |
| test(function(t) { |
| var ax = axElementById("aria-button-true"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<div role=button aria-pressed=true> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("button"); |
| assert_equals(ax.checked, ""); |
| }, "<button> does not set checked property"); |
| |
| test(function(t) { |
| var ax = axElementById("button-false"); |
| assert_equals(ax.checked, "false"); |
| }, "<button aria-pressed=false> is not checked"); |
| |
| test(function(t) { |
| var ax = axElementById("button-false"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<button aria-pressed=false> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("button-mixed"); |
| assert_equals(ax.checked, "mixed"); |
| }, "<button aria-pressed=mixed> has pressed state of checked"); |
| |
| test(function(t) { |
| var ax = axElementById("button-mixed"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<button aria-pressed=mixed> is a toggle button"); |
| |
| test(function(t) { |
| var ax = axElementById("button-true"); |
| assert_equals(ax.checked, "true"); |
| }, "<button aria-pressed=true> has checked state of true"); |
| |
| test(function(t) { |
| var ax = axElementById("button-true"); |
| assert_equals(ax.role, "AXRole: AXToggleButton"); |
| }, "<button aria-pressed=true> is a toggle button"); |
| |
| </script> |
