test_selects.html (5451B)
1 <html> 2 3 <head> 4 <title>HTML selects accessible states tests</title> 5 <link rel="stylesheet" type="text/css" 6 href="chrome://mochikit/content/tests/SimpleTest/test.css" /> 7 8 <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> 9 <script src="chrome://mochikit/content/tests/SimpleTest/EventUtils.js"></script> 10 11 <script type="application/javascript" 12 src="../common.js"></script> 13 <script type="application/javascript" 14 src="../role.js"></script> 15 <script type="application/javascript" 16 src="../states.js"></script> 17 <script type="application/javascript" 18 src="../events.js"></script> 19 20 <script type="application/javascript"> 21 22 // gA11yEventDumpToConsole = true; 23 24 function doTest() { 25 // combobox 26 var combobox = getAccessible("combobox"); 27 testStates(combobox, 28 STATE_HASPOPUP | STATE_COLLAPSED | STATE_FOCUSABLE, 0, 29 STATE_FOCUSED, 0); 30 31 var comboboxList = combobox.firstChild; 32 testStates(comboboxList, STATE_INVISIBLE, 0, STATE_FOCUSABLE, 0); 33 34 var opt1 = comboboxList.firstChild; 35 testStates(opt1, STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE, 36 0, STATE_FOCUSED, 0); 37 38 var opt2 = comboboxList.lastChild; 39 testStates(opt2, STATE_SELECTABLE | STATE_FOCUSABLE, 0, STATE_SELECTED, 0, 40 STATE_FOCUSED, 0); 41 42 // collapsed combobox 43 testStates("collapsedcombobox", 44 STATE_COLLAPSED | STATE_FOCUSABLE, 0, 45 STATE_FOCUSED, 0); 46 47 testStates("collapsed-1", 48 STATE_FOCUSABLE | STATE_SELECTABLE, 0, 49 STATE_OFFSCREEN | STATE_INVISIBLE, 0); 50 51 testStates("collapsed-2", 52 STATE_OFFSCREEN, 0, 53 STATE_INVISIBLE, 0); 54 55 // listbox 56 testStates("listbox", 57 STATE_FOCUSABLE, 0, 58 STATE_HASPOPUP | STATE_COLLAPSED | STATE_FOCUSED); 59 60 testStates("listitem-active", 61 STATE_FOCUSABLE | STATE_SELECTABLE, EXT_STATE_ACTIVE, 62 STATE_SELECTED | STATE_FOCUSED); 63 64 testStates("listitem", 65 STATE_FOCUSABLE | STATE_SELECTABLE, 0, 66 STATE_SELECTED | STATE_FOCUSED, EXT_STATE_ACTIVE); 67 68 testStates("listitem-disabled", 69 STATE_UNAVAILABLE, 0, 70 STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE, 71 EXT_STATE_ACTIVE); 72 73 testStates("listgroup", 74 0, 0, 75 STATE_UNAVAILABLE | STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE, 76 EXT_STATE_ACTIVE); 77 78 testStates("listgroup-disabled", 79 STATE_UNAVAILABLE, 0, 80 STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE, 81 EXT_STATE_ACTIVE); 82 83 todo(false, "no unavailable state on option in disabled group (bug 759666)"); 84 // testStates("listitem-disabledgroup", 85 // STATE_UNAVAILABLE, 0, 86 // STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE, 87 // EXT_STATE_ACTIVE); 88 89 testStates("listbox-disabled", 90 STATE_UNAVAILABLE, 0, 91 STATE_FOCUSABLE); 92 93 todo(false, "no unavailable state on option in disabled select (bug 759666)"); 94 // testStates("listitem-disabledlistbox", 95 // STATE_UNAVAILABLE, 0, 96 // STATE_SELECTABLE | STATE_SELECTED | STATE_FOCUSABLE, 97 // EXT_STATE_ACTIVE); 98 99 SimpleTest.finish(); 100 } 101 102 SimpleTest.waitForExplicitFinish(); 103 addA11yLoadEvent(doTest); 104 </script> 105 106 </head> 107 108 <body> 109 <a target="_blank" 110 href="https://bugzilla.mozilla.org/show_bug.cgi?id=443889" 111 title="mochitest for selects and lists"> 112 Mozilla Bug 443889 113 </a> 114 <a target="_blank" 115 href="https://bugzilla.mozilla.org/show_bug.cgi?id=640716" 116 title="mochitest for selects and lists"> 117 Mozilla Bug 640716 118 </a> 119 <a target="_blank" 120 href="https://bugzilla.mozilla.org/show_bug.cgi?id=689847" 121 title="Expose active state on current item of selectable widgets"> 122 Mozilla Bug 689847 123 </a> 124 <a target="_blank" 125 href="https://bugzilla.mozilla.org/show_bug.cgi?id=756983" 126 title="Isolate focusable and unavailable states from State()"> 127 Mozilla Bug 756983 128 </a> 129 <a target="_blank" 130 href="https://bugzilla.mozilla.org/show_bug.cgi?id=907682" 131 title=" HTML:option group position is not correct when select is collapsed"> 132 Mozilla Bug 907682 133 </a> 134 <p id="display"></p> 135 <div id="content" style="display: none"></div> 136 <pre id="test"> 137 </pre> 138 139 <select id="combobox"> 140 <option>item 1</option> 141 <option>item 2</option> 142 </select> 143 144 <select id="collapsedcombobox"> 145 <option id="collapsed-1">item 1</option> 146 <option id="collapsed-2">item 2</option> 147 </select> 148 149 <select id="listbox" name="component" size="3"> 150 <option id="listitem-active">Build</option> 151 <option id="listitem">Disability Access APIs</option> 152 <option id="listitem-disabled" disabled>General</option> 153 <optgroup id="listgroup" label="group"> 154 <option>option</option> 155 </optgroup> 156 <optgroup id="listgroup-disabled" disabled label="group2"> 157 <option id="listitem-disabledgroup">UI</option> 158 </optgroup> 159 </select> 160 161 <select id="listbox-disabled" size="3" disabled> 162 <option id="listitem-disabledlistbox">option</option> 163 </select> 164 165 </body> 166 </html>