accessible/tests/mochitest/tree/test_table.html

Wed, 31 Dec 2014 06:09:35 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 06:09:35 +0100
changeset 0
6474c204b198
permissions
-rw-r--r--

Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.

michael@0 1 <!DOCTYPE html>
michael@0 2 <html>
michael@0 3 <head>
michael@0 4 <title>HTML table tests</title>
michael@0 5 <link rel="stylesheet" type="text/css"
michael@0 6 href="chrome://mochikit/content/tests/SimpleTest/test.css" />
michael@0 7
michael@0 8 <script type="application/javascript"
michael@0 9 src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
michael@0 10
michael@0 11 <script type="application/javascript"
michael@0 12 src="../common.js"></script>
michael@0 13 <script type="application/javascript"
michael@0 14 src="../role.js"></script>
michael@0 15
michael@0 16 <script type="application/javascript">
michael@0 17 function doTest()
michael@0 18 {
michael@0 19 //////////////////////////////////////////////////////////////////////////
michael@0 20 // tables having captions
michael@0 21
michael@0 22 // Two captions, first is used, second is ignored.
michael@0 23 var accTree =
michael@0 24 { TABLE: [
michael@0 25 { CAPTION: [
michael@0 26 {
michael@0 27 role: ROLE_TEXT_LEAF,
michael@0 28 name: "caption"
michael@0 29 }
michael@0 30 ] },
michael@0 31 { ROW: [
michael@0 32 { COLUMNHEADER: [ { TEXT_LEAF: [ ] } ] },
michael@0 33 { COLUMNHEADER: [ { TEXT_LEAF: [ ] } ] }
michael@0 34 ] },
michael@0 35 { ROW: [
michael@0 36 { CELL: [ { TEXT_LEAF: [ ] } ] },
michael@0 37 { CELL: [ { TEXT_LEAF: [ ] } ] }
michael@0 38 ] },
michael@0 39 { ROW: [
michael@0 40 { CELL: [ { TEXT_LEAF: [ ] } ] },
michael@0 41 { CELL: [ { TEXT_LEAF: [ ] } ] }
michael@0 42 ] },
michael@0 43 { ROW: [
michael@0 44 { CELL: [ { TEXT_LEAF: [ ] } ] },
michael@0 45 { CELL: [ { TEXT_LEAF: [ ] } ] }
michael@0 46 ] }
michael@0 47 ] };
michael@0 48
michael@0 49 testAccessibleTree("table", accTree);
michael@0 50
michael@0 51 // One caption, empty text, caption is ignored.
michael@0 52 accTree =
michael@0 53 { TABLE: [
michael@0 54 { ROW: [
michael@0 55 { CELL: [ { TEXT_LEAF: [ ] } ] },
michael@0 56 { CELL: [ { TEXT_LEAF: [ ] } ] }
michael@0 57 ] }
michael@0 58 ] };
michael@0 59
michael@0 60 testAccessibleTree("table_caption_empty", accTree);
michael@0 61
michael@0 62 // Two captions, first has empty text, both are ignored.
michael@0 63 accTree =
michael@0 64 { TABLE: [
michael@0 65 { ROW: [
michael@0 66 { CELL: [ { TEXT_LEAF: [ ] } ] },
michael@0 67 { CELL: [ { TEXT_LEAF: [ ] } ] }
michael@0 68 ] }
michael@0 69 ] };
michael@0 70
michael@0 71 testAccessibleTree("table_caption_firstempty", accTree);
michael@0 72
michael@0 73 // One caption, placed in the end of table. In use.
michael@0 74 accTree =
michael@0 75 { TABLE: [
michael@0 76 { CAPTION: [
michael@0 77 {
michael@0 78 role: ROLE_TEXT_LEAF,
michael@0 79 name: "caption"
michael@0 80 }
michael@0 81 ] },
michael@0 82 { ROW: [
michael@0 83 { CELL: [ { TEXT_LEAF: [ ] } ] },
michael@0 84 { CELL: [ { TEXT_LEAF: [ ] } ] }
michael@0 85 ] }
michael@0 86 ] };
michael@0 87
michael@0 88 testAccessibleTree("table_caption_intheend", accTree);
michael@0 89
michael@0 90 //////////////////////////////////////////////////////////////////////////
michael@0 91 // table2 (consist of one column)
michael@0 92
michael@0 93 accTree = {
michael@0 94 role: ROLE_TABLE,
michael@0 95 children: [
michael@0 96 {
michael@0 97 role: ROLE_ROW,
michael@0 98 children: [
michael@0 99 {
michael@0 100 role: ROLE_COLUMNHEADER
michael@0 101 }
michael@0 102 ]
michael@0 103 },
michael@0 104 {
michael@0 105 role: ROLE_ROW,
michael@0 106 children: [
michael@0 107 {
michael@0 108 role: ROLE_CELL
michael@0 109 }
michael@0 110 ]
michael@0 111 }
michael@0 112 ]
michael@0 113 };
michael@0 114
michael@0 115 testAccessibleTree("table2", accTree);
michael@0 116
michael@0 117 //////////////////////////////////////////////////////////////////////////
michael@0 118 // table3 (consist of one row)
michael@0 119
michael@0 120 accTree = {
michael@0 121 role: ROLE_TABLE,
michael@0 122 children: [
michael@0 123 {
michael@0 124 role: ROLE_ROW,
michael@0 125 children: [
michael@0 126 {
michael@0 127 role: ROLE_ROWHEADER
michael@0 128 },
michael@0 129 {
michael@0 130 role: ROLE_CELL
michael@0 131 }
michael@0 132 ]
michael@0 133 }
michael@0 134 ]
michael@0 135 };
michael@0 136
michael@0 137 testAccessibleTree("table3", accTree);
michael@0 138
michael@0 139 /////////////////////////////////////////////////////////////////////////
michael@0 140 // table4 (display: table-row)
michael@0 141 accTree =
michael@0 142 { TABLE: [
michael@0 143 { ROW: [
michael@0 144 { CELL: [
michael@0 145 { TEXT_LEAF: [ ] }
michael@0 146 ] }
michael@0 147 ] } ]
michael@0 148 };
michael@0 149 testAccessibleTree("table4", accTree);
michael@0 150
michael@0 151 SimpleTest.finish();
michael@0 152 }
michael@0 153
michael@0 154 SimpleTest.waitForExplicitFinish();
michael@0 155 addA11yLoadEvent(doTest);
michael@0 156 </script>
michael@0 157 </head>
michael@0 158 <body>
michael@0 159
michael@0 160 <a target="_blank"
michael@0 161 title="When a table has only one column per row and that column happens to be a column header its role is exposed wrong"
michael@0 162 href="https://bugzilla.mozilla.org/show_bug.cgi?id=529621">
michael@0 163 Mozilla Bug 529621
michael@0 164 </a>
michael@0 165 <a target="_blank"
michael@0 166 title="when div has display style table-row"
michael@0 167 href="https://bugzilla.mozilla.org/show_bug.cgi?id=727722">
michael@0 168 Mozilla Bug 727722
michael@0 169 </a>
michael@0 170 <p id="display"></p>
michael@0 171 <div id="content" style="display: none"></div>
michael@0 172 <pre id="test">
michael@0 173 </pre>
michael@0 174
michael@0 175 <table id="table">
michael@0 176 <thead>
michael@0 177 <tr>
michael@0 178 <th>col1</th><th>col2</th>
michael@0 179 </tr>
michael@0 180 </thead>
michael@0 181 <caption>caption</caption>
michael@0 182 <tbody>
michael@0 183 <tr>
michael@0 184 <td>cell1</td><td>cell2</td>
michael@0 185 </tr>
michael@0 186 </tbody>
michael@0 187 <tr>
michael@0 188 <td>cell3</td><td>cell4</td>
michael@0 189 </tr>
michael@0 190 <caption>caption2</caption>
michael@0 191 <tfoot>
michael@0 192 <tr>
michael@0 193 <td>cell5</td><td>cell6</td>
michael@0 194 </tr>
michael@0 195 </tfoot>
michael@0 196 </table>
michael@0 197
michael@0 198 <table id="table_caption_empty">
michael@0 199 <caption></caption>
michael@0 200 <tr>
michael@0 201 <td>cell1</td><td>cell2</td>
michael@0 202 </tr>
michael@0 203 </table>
michael@0 204
michael@0 205 <table id="table_caption_firstempty">
michael@0 206 <caption></caption>
michael@0 207 <tr>
michael@0 208 <td>cell1</td><td>cell2</td>
michael@0 209 </tr>
michael@0 210 <caption>caption</caption>
michael@0 211 </table>
michael@0 212
michael@0 213 <table id="table_caption_intheend">
michael@0 214 <tr>
michael@0 215 <td>cell1</td><td>cell2</td>
michael@0 216 </tr>
michael@0 217 <caption>caption</caption>
michael@0 218 </table>
michael@0 219
michael@0 220 <table id="table2">
michael@0 221 <thead>
michael@0 222 <tr>
michael@0 223 <th>colheader</th>
michael@0 224 </tr>
michael@0 225 </thead>
michael@0 226 <tbody>
michael@0 227 <tr>
michael@0 228 <td>bla</td>
michael@0 229 </tr>
michael@0 230 </tbody>
michael@0 231 </table>
michael@0 232
michael@0 233 <table id="table3">
michael@0 234 <tr>
michael@0 235 <th>rowheader</th>
michael@0 236 <td>cell</td>
michael@0 237 </tr>
michael@0 238 </table>
michael@0 239
michael@0 240 <table id="table4">
michael@0 241 <div style="display: table-row">
michael@0 242 <td>cell1</td>
michael@0 243 </div>
michael@0 244 </table>
michael@0 245 </body>
michael@0 246 </html>

mercurial