Wed, 31 Dec 2014 06:09:35 +0100
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
michael@0 | 1 | <html> |
michael@0 | 2 | <head> |
michael@0 | 3 | <title>[AccessFu] Improve reading of table semantics</title> |
michael@0 | 4 | |
michael@0 | 5 | <link rel="stylesheet" type="text/css" |
michael@0 | 6 | href="chrome://mochikit/content/tests/SimpleTest/test.css" /> |
michael@0 | 7 | <script type="application/javascript" |
michael@0 | 8 | src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> |
michael@0 | 9 | <script type="application/javascript" |
michael@0 | 10 | src="../common.js"></script> |
michael@0 | 11 | <script type="application/javascript" |
michael@0 | 12 | src="output.js"></script> |
michael@0 | 13 | <script type="application/javascript"> |
michael@0 | 14 | |
michael@0 | 15 | function doTest() { |
michael@0 | 16 | // Test the following accOrElmOrID. |
michael@0 | 17 | var tests = [{ |
michael@0 | 18 | accOrElmOrID: "table1", |
michael@0 | 19 | expectedUtterance: [["table with 2 columns and 2 rows", |
michael@0 | 20 | "Column 1 Row 1", "col1", "Column 2 Row 1", "col2", |
michael@0 | 21 | "Column 1 Row 2 col1", "cell1", "Column 2 Row 2 col2", "cell2"], [ |
michael@0 | 22 | "col1", "Column 1 Row 1", "col2", "Column 2 Row 1", "cell1", |
michael@0 | 23 | "Column 1 Row 2 col1", "cell2", "Column 2 Row 2 col2", |
michael@0 | 24 | "table with 2 columns and 2 rows"]], |
michael@0 | 25 | expectedBraille: [["tbl 2c 2r", "c1r1", "col1", "c2r1", "col2", |
michael@0 | 26 | "c1r2 col1", "cell1", "c2r2 col2", "cell2"], ["col1", "c1r1", "col2", |
michael@0 | 27 | "c2r1", "cell1", "c1r2 col1", "cell2", "c2r2 col2", "tbl 2c 2r"]] |
michael@0 | 28 | }, { |
michael@0 | 29 | accOrElmOrID: "table2", |
michael@0 | 30 | expectedUtterance: [["table with 2 columns and 2 rows", |
michael@0 | 31 | "Column 1 Row 1 col1", "cell1", "Column 2 Row 1 col2", |
michael@0 | 32 | "table with 1 column and 2 rows", "Column 1 Row 1", "colheader", |
michael@0 | 33 | "Column 1 Row 2 colheader", "bla", "Column 1 Row 2", "col1", |
michael@0 | 34 | "Column 2 Row 2", "col2"], ["cell1", "Column 1 Row 1 col1", |
michael@0 | 35 | "colheader", "Column 1 Row 1", "bla", "Column 1 Row 2 colheader", |
michael@0 | 36 | "table with 1 column and 2 rows", "Column 2 Row 1 col2", "col1", |
michael@0 | 37 | "Column 1 Row 2", "col2", "Column 2 Row 2", |
michael@0 | 38 | "table with 2 columns and 2 rows"]], |
michael@0 | 39 | expectedBraille: [["tbl 2c 2r", "c1r1 col1", "cell1", "c2r1 col2", |
michael@0 | 40 | "tbl 1c 2r", "c1r1", "colheader", "c1r2 colheader", "bla", "c1r2", |
michael@0 | 41 | "col1", "c2r2", "col2"], ["cell1", "c1r1 col1", "colheader", "c1r1", |
michael@0 | 42 | "bla", "c1r2 colheader", "tbl 1c 2r", "c2r1 col2", "col1", "c1r2", |
michael@0 | 43 | "col2", "c2r2", "tbl 2c 2r"]] |
michael@0 | 44 | }, { |
michael@0 | 45 | accOrElmOrID: "table3", |
michael@0 | 46 | expectedUtterance: [["table with 2 columns and 2 rows", |
michael@0 | 47 | "Column 2 Row 1 col2", "table with 1 column and 2 rows", |
michael@0 | 48 | "Column 1 Row 1", "colheader", "Column 1 Row 2 colheader", "bla"], [ |
michael@0 | 49 | "colheader", "Column 1 Row 1", "bla", "Column 1 Row 2 colheader", |
michael@0 | 50 | "table with 1 column and 2 rows", "Column 2 Row 1 col2", |
michael@0 | 51 | "table with 2 columns and 2 rows"]], |
michael@0 | 52 | expectedBraille: [["tbl 1c 2r", "c1r1", "colheader", "c1r2 colheader", |
michael@0 | 53 | "bla"], ["colheader", "c1r1", "bla", "c1r2 colheader", "tbl 1c 2r"]] |
michael@0 | 54 | }, { |
michael@0 | 55 | accOrElmOrID: "table4", |
michael@0 | 56 | expectedUtterance: [["table with 4 columns and 3 rows", |
michael@0 | 57 | "Column 1 Row 1", "col1", "Column 2 Row 1", "col2", "Column 3 Row 1", |
michael@0 | 58 | "col3", "Column 1 Row 2 spans 2 columns col1", "row1", |
michael@0 | 59 | "Column 3 Row 2 col3 row1", "cell1", |
michael@0 | 60 | "Column 4 Row 2 spans 2 rows row1", "cell2", "Column 1 Row 3 col1", |
michael@0 | 61 | "row2", "Column 2 Row 3 col2 row2", "cell3", |
michael@0 | 62 | "Column 3 Row 3 col3 row2", "cell4"], ["col1", "Column 1 Row 1", |
michael@0 | 63 | "col2", "Column 2 Row 1", "col3", "Column 3 Row 1", "row1", |
michael@0 | 64 | "Column 1 Row 2 spans 2 columns col1", "cell1", |
michael@0 | 65 | "Column 3 Row 2 col3 row1", "cell2", |
michael@0 | 66 | "Column 4 Row 2 spans 2 rows row1", "row2", "Column 1 Row 3 col1", |
michael@0 | 67 | "cell3", "Column 2 Row 3 col2 row2", "cell4", |
michael@0 | 68 | "Column 3 Row 3 col3 row2", "table with 4 columns and 3 rows"]], |
michael@0 | 69 | expectedBraille: [["tbl 4c 3r", "c1r1", "col1", "c2r1", "col2", "c3r1", |
michael@0 | 70 | "col3", "c1r2 col1", "row1", "c3r2 col3 row1", "cell1", "c4r2 row1", |
michael@0 | 71 | "cell2", "c1r3 col1", "row2", "c2r3 col2 row2", "cell3", |
michael@0 | 72 | "c3r3 col3 row2", "cell4"], ["col1", "c1r1", "col2", "c2r1", "col3", |
michael@0 | 73 | "c3r1", "row1", "c1r2 col1", "cell1", "c3r2 col3 row1", "cell2", |
michael@0 | 74 | "c4r2 row1", "row2", "c1r3 col1", "cell3", "c2r3 col2 row2", "cell4", |
michael@0 | 75 | "c3r3 col3 row2", "tbl 4c 3r"]] |
michael@0 | 76 | }, { |
michael@0 | 77 | accOrElmOrID: "table5", |
michael@0 | 78 | expectedUtterance: [["Row1", "Row2"], ["Row1", "Row2"]], |
michael@0 | 79 | expectedBraille: [["Row1", "Row2"], ["Row1", "Row2"]] |
michael@0 | 80 | }, { |
michael@0 | 81 | // Test pivot to table1_th1 from table1. |
michael@0 | 82 | accOrElmOrID: "table1_th1", |
michael@0 | 83 | oldAccOrElmOrID: "table1", |
michael@0 | 84 | expectedUtterance: [["Column 1 Row 1", "col1"], ["col1", |
michael@0 | 85 | "Column 1 Row 1"]], |
michael@0 | 86 | expectedBraille: [["c1r1", "col1"], ["col1", "c1r1"]] |
michael@0 | 87 | }, { |
michael@0 | 88 | // Test pivot to table1_td2 from table1. |
michael@0 | 89 | accOrElmOrID: "table1_td2", |
michael@0 | 90 | oldAccOrElmOrID: "table1", |
michael@0 | 91 | expectedUtterance: [["Column 2 Row 2 col2", "cell2"], ["cell2", |
michael@0 | 92 | "Column 2 Row 2 col2"]], |
michael@0 | 93 | expectedBraille: [["c2r2 col2", "cell2"], ["cell2", "c2r2 col2"]] |
michael@0 | 94 | }, { |
michael@0 | 95 | // Test pivot to table1_td2 from table1_th1. |
michael@0 | 96 | accOrElmOrID: "table1_td2", |
michael@0 | 97 | oldAccOrElmOrID: "table1_th1", |
michael@0 | 98 | expectedUtterance: [["Column 2 Row 2 col2", "cell2"], ["cell2", |
michael@0 | 99 | "Column 2 Row 2 col2"]], |
michael@0 | 100 | expectedBraille: [["c2r2 col2", "cell2"], ["cell2", "c2r2 col2"]] |
michael@0 | 101 | }, { |
michael@0 | 102 | // Test pivot to table1_td2 from table1_td1. |
michael@0 | 103 | accOrElmOrID: "table1_td2", |
michael@0 | 104 | oldAccOrElmOrID: "table1_td1", |
michael@0 | 105 | expectedUtterance: [["Column 2 col2", "cell2"], ["cell2", |
michael@0 | 106 | "Column 2 col2"]], |
michael@0 | 107 | expectedBraille: [["c2r2 col2", "cell2"], ["cell2", "c2r2 col2"]] |
michael@0 | 108 | }, { |
michael@0 | 109 | // Test pivot to table2_cell_1 from table2. |
michael@0 | 110 | accOrElmOrID: "table2_cell_1", |
michael@0 | 111 | oldAccOrElmOrID: "table2", |
michael@0 | 112 | expectedUtterance: [["Column 1 Row 1 col1", "cell1"], ["cell1", |
michael@0 | 113 | "Column 1 Row 1 col1"]], |
michael@0 | 114 | expectedBraille: [["c1r1 col1", "cell1"], ["cell1", "c1r1 col1"]] |
michael@0 | 115 | }, { |
michael@0 | 116 | // Test pivot to table2_cell_2 from table2. |
michael@0 | 117 | accOrElmOrID: "table2_cell_2", |
michael@0 | 118 | oldAccOrElmOrID: "table2", |
michael@0 | 119 | expectedUtterance: [["Column 2 Row 1 col2", |
michael@0 | 120 | "table with 1 column and 2 rows", "Column 1 Row 1", "colheader", |
michael@0 | 121 | "Column 1 Row 2 colheader", "bla"], ["colheader", "Column 1 Row 1", |
michael@0 | 122 | "bla", "Column 1 Row 2 colheader", "table with 1 column and 2 rows", |
michael@0 | 123 | "Column 2 Row 1 col2"]], |
michael@0 | 124 | expectedBraille: [["c2r1 col2", "tbl 1c 2r", "c1r1", "colheader", |
michael@0 | 125 | "c1r2 colheader", "bla"], ["colheader", "c1r1", "bla", |
michael@0 | 126 | "c1r2 colheader", "tbl 1c 2r", "c2r1 col2"]] |
michael@0 | 127 | }, { |
michael@0 | 128 | // Test pivot to table2_cell_1 from table2_cell_2. |
michael@0 | 129 | accOrElmOrID: "table2_cell_1", |
michael@0 | 130 | oldAccOrElmOrID: "table2_cell_2", |
michael@0 | 131 | expectedUtterance: [["Column 1 col1", "cell1"], ["cell1", |
michael@0 | 132 | "Column 1 col1"]], |
michael@0 | 133 | expectedBraille: [["c1r1 col1", "cell1"], ["cell1", "c1r1 col1"]] |
michael@0 | 134 | }, { |
michael@0 | 135 | // Test pivot to table3_cell from table2. |
michael@0 | 136 | accOrElmOrID: "table3_cell", |
michael@0 | 137 | oldAccOrElmOrID: "table2", |
michael@0 | 138 | expectedUtterance: [["Column 2 Row 1 col2", |
michael@0 | 139 | "table with 1 column and 2 rows", "Column 1 Row 2 colheader", |
michael@0 | 140 | "bla"], ["bla", "Column 1 Row 2 colheader", |
michael@0 | 141 | "table with 1 column and 2 rows", "Column 2 Row 1 col2"]], |
michael@0 | 142 | expectedBraille: [["c1r2 colheader", "bla"], ["bla", "c1r2 colheader"]] |
michael@0 | 143 | }, { |
michael@0 | 144 | // Test pivot to table3_cell from table2_cell_1. |
michael@0 | 145 | accOrElmOrID: "table3_cell", |
michael@0 | 146 | oldAccOrElmOrID: "table2_cell_1", |
michael@0 | 147 | expectedUtterance: [["Column 2 col2", "table with 1 column and 2 rows", |
michael@0 | 148 | "Column 1 Row 2 colheader", "bla"], ["bla", |
michael@0 | 149 | "Column 1 Row 2 colheader", "table with 1 column and 2 rows", |
michael@0 | 150 | "Column 2 Row 1 col2"]], |
michael@0 | 151 | expectedBraille: [["c1r2 colheader", "bla"], ["bla", "c1r2 colheader"]] |
michael@0 | 152 | }, { |
michael@0 | 153 | // Test pivot to table3_cell from table3_ch. |
michael@0 | 154 | accOrElmOrID: "table3_cell", |
michael@0 | 155 | oldAccOrElmOrID: "table3_ch", |
michael@0 | 156 | expectedUtterance: [["Row 2", "bla"], ["bla", "Row 2"]], |
michael@0 | 157 | expectedBraille: [["c1r2", "bla"], ["bla", "c1r2"]] |
michael@0 | 158 | }, { |
michael@0 | 159 | // Test pivot to table3_cell from table1_td1. |
michael@0 | 160 | accOrElmOrID: "table3_cell", |
michael@0 | 161 | oldAccOrElmOrID: "table1_td1", |
michael@0 | 162 | expectedUtterance: [["table with 2 columns and 2 rows", |
michael@0 | 163 | "Column 2 Row 1 col2", "table with 1 column and 2 rows", |
michael@0 | 164 | "Column 1 Row 2 colheader", "bla"], ["bla", |
michael@0 | 165 | "Column 1 Row 2 colheader", "table with 1 column and 2 rows", |
michael@0 | 166 | "Column 2 Row 1 col2", "table with 2 columns and 2 rows"]], |
michael@0 | 167 | expectedBraille: [["c1r2 colheader", "bla"], ["bla", "c1r2 colheader"]] |
michael@0 | 168 | }, { |
michael@0 | 169 | // Test pivot to table4_ch_3 from table4. |
michael@0 | 170 | accOrElmOrID: "table4_ch_3", |
michael@0 | 171 | oldAccOrElmOrID: "table4", |
michael@0 | 172 | expectedUtterance: [["Column 3 Row 1", "col3"], ["col3", |
michael@0 | 173 | "Column 3 Row 1"]], |
michael@0 | 174 | expectedBraille: [["c3r1", "col3"], ["col3", "c3r1"]] |
michael@0 | 175 | }, { |
michael@0 | 176 | // Test pivot to table4_rh_1 from table4_ch_3. |
michael@0 | 177 | accOrElmOrID: "table4_rh_1", |
michael@0 | 178 | oldAccOrElmOrID: "table4_ch_3", |
michael@0 | 179 | expectedUtterance: [["Column 1 Row 2 spans 2 columns col1", "row1"], [ |
michael@0 | 180 | "row1", "Column 1 Row 2 spans 2 columns col1"]], |
michael@0 | 181 | expectedBraille: [["c1r2 col1", "row1"], ["row1", "c1r2 col1"]] |
michael@0 | 182 | }, { |
michael@0 | 183 | // Test pivot to table4_cell_3 from table4_rh_1. |
michael@0 | 184 | accOrElmOrID: "table4_cell_3", |
michael@0 | 185 | oldAccOrElmOrID: "table4_rh_1", |
michael@0 | 186 | expectedUtterance: [["Column 4 spans 2 rows", "cell2"], ["cell2", |
michael@0 | 187 | "Column 4 spans 2 rows"]], |
michael@0 | 188 | expectedBraille: [["c4r2", "cell2"], ["cell2", "c4r2"]] |
michael@0 | 189 | }, { |
michael@0 | 190 | // Test pivot to table4_cell_5 from table4_cell_3. |
michael@0 | 191 | accOrElmOrID: "table4_cell_5", |
michael@0 | 192 | oldAccOrElmOrID: "table4_cell_3", |
michael@0 | 193 | expectedUtterance: [["Column 2 Row 3 col2 row2", "cell3"], ["cell3", |
michael@0 | 194 | "Column 2 Row 3 col2 row2"]], |
michael@0 | 195 | expectedBraille: [["c2r3 col2 row2", "cell3"], ["cell3", |
michael@0 | 196 | "c2r3 col2 row2"]] |
michael@0 | 197 | }]; |
michael@0 | 198 | |
michael@0 | 199 | SpecialPowers.setIntPref(PREF_UTTERANCE_ORDER, 0); |
michael@0 | 200 | |
michael@0 | 201 | // Test outputs (utterance and braille) for tables including their |
michael@0 | 202 | // headers and cells. |
michael@0 | 203 | tests.forEach(function run(test) { |
michael@0 | 204 | var outputOrderValues = [0, 1]; |
michael@0 | 205 | outputOrderValues.forEach(function testOutputOrder(outputOrder) { |
michael@0 | 206 | SpecialPowers.setIntPref(PREF_UTTERANCE_ORDER, outputOrder); |
michael@0 | 207 | testOutput(test.expectedUtterance[outputOrder], test.accOrElmOrID, |
michael@0 | 208 | test.oldAccOrElmOrID, 1); |
michael@0 | 209 | testOutput(test.expectedBraille[outputOrder], test.accOrElmOrID, |
michael@0 | 210 | test.oldAccOrElmOrID, 0); |
michael@0 | 211 | }); |
michael@0 | 212 | }); |
michael@0 | 213 | |
michael@0 | 214 | // If there was an original utterance order preference, revert to it. |
michael@0 | 215 | SpecialPowers.clearUserPref(PREF_UTTERANCE_ORDER); |
michael@0 | 216 | SimpleTest.finish(); |
michael@0 | 217 | } |
michael@0 | 218 | |
michael@0 | 219 | SimpleTest.waitForExplicitFinish(); |
michael@0 | 220 | addA11yLoadEvent(doTest); |
michael@0 | 221 | </script> |
michael@0 | 222 | </head> |
michael@0 | 223 | <body> |
michael@0 | 224 | <div id="root"> |
michael@0 | 225 | <a target="_blank" |
michael@0 | 226 | href="https://bugzilla.mozilla.org/show_bug.cgi?id=830748" |
michael@0 | 227 | title="[AccessFu] Improve reading of table semantics"> |
michael@0 | 228 | Mozilla Bug 830748 |
michael@0 | 229 | </a> |
michael@0 | 230 | <p id="display"></p> |
michael@0 | 231 | <div id="content" style="display: none"></div> |
michael@0 | 232 | <pre id="test"></pre> |
michael@0 | 233 | <table id="table1"> |
michael@0 | 234 | <thead> |
michael@0 | 235 | <tr> |
michael@0 | 236 | <th id="table1_th1">col1</th> |
michael@0 | 237 | <th>col2</th> |
michael@0 | 238 | </tr> |
michael@0 | 239 | </thead> |
michael@0 | 240 | <tbody> |
michael@0 | 241 | <tr> |
michael@0 | 242 | <td id="table1_td1">cell1</td> |
michael@0 | 243 | <td id="table1_td2">cell2</td> |
michael@0 | 244 | </tr> |
michael@0 | 245 | </tbody> |
michael@0 | 246 | </table> |
michael@0 | 247 | <table id="table2" border="1"> |
michael@0 | 248 | <tr> |
michael@0 | 249 | <td id="table2_cell_1" headers="table2_ch_1">cell1</td> |
michael@0 | 250 | <td id="table2_cell_2" headers="table2_ch_2"> |
michael@0 | 251 | <table id="table3"> |
michael@0 | 252 | <thead> |
michael@0 | 253 | <tr> |
michael@0 | 254 | <th id="table3_ch">colheader</th> |
michael@0 | 255 | </tr> |
michael@0 | 256 | </thead> |
michael@0 | 257 | <tbody> |
michael@0 | 258 | <tr> |
michael@0 | 259 | <td id="table3_cell">bla</td> |
michael@0 | 260 | </tr> |
michael@0 | 261 | </tbody> |
michael@0 | 262 | </table> |
michael@0 | 263 | </td> |
michael@0 | 264 | </tr> |
michael@0 | 265 | <tr> |
michael@0 | 266 | <td id="table2_ch_1" scope="col">col1</td> |
michael@0 | 267 | <td id="table2_ch_2" scope="col">col2</td> |
michael@0 | 268 | </tr> |
michael@0 | 269 | </table> |
michael@0 | 270 | <table id="table4" border="1"> |
michael@0 | 271 | <thead> |
michael@0 | 272 | <tr> |
michael@0 | 273 | <th id="table4_ch_1">col1</th> |
michael@0 | 274 | <th id="table4_ch_2">col2</th> |
michael@0 | 275 | <td id="table4_ch_3" scope="col">col3</td> |
michael@0 | 276 | </tr> |
michael@0 | 277 | </thead> |
michael@0 | 278 | <tbody> |
michael@0 | 279 | <tr> |
michael@0 | 280 | <th id="table4_rh_1" colspan="2">row1</th> |
michael@0 | 281 | <td id="table4_cell_2">cell1</td> |
michael@0 | 282 | <td id="table4_cell_3" rowspan="2">cell2</td> |
michael@0 | 283 | </tr> |
michael@0 | 284 | <tr> |
michael@0 | 285 | <td id="table4_rh_2" scope="row">row2</td> |
michael@0 | 286 | <td id="table4_cell_5">cell3</td> |
michael@0 | 287 | <td id="table4_cell_6">cell4</td> |
michael@0 | 288 | </tr> |
michael@0 | 289 | </tbody> |
michael@0 | 290 | </table> |
michael@0 | 291 | <table id="table5"> |
michael@0 | 292 | <tr><td>Row1</td></tr> |
michael@0 | 293 | <tr><td>Row2</td></tr> |
michael@0 | 294 | </table> |
michael@0 | 295 | </div> |
michael@0 | 296 | </body> |
michael@0 | 297 | </html> |