Fri, 16 Jan 2015 18:13:44 +0100
Integrate suggestion from review to improve consistency with existing code.
michael@0 | 1 | <!DOCTYPE html> |
michael@0 | 2 | <html> |
michael@0 | 3 | <head> |
michael@0 | 4 | <title>Broken context hierarchy</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 | <script type="application/javascript" |
michael@0 | 16 | src="../states.js"></script> |
michael@0 | 17 | |
michael@0 | 18 | <script type="application/javascript"> |
michael@0 | 19 | /** |
michael@0 | 20 | * Return true if TD element has a generic accessible. |
michael@0 | 21 | */ |
michael@0 | 22 | function isTDGeneric(aID) |
michael@0 | 23 | { |
michael@0 | 24 | return isAccessible(aID) && !isAccessible(aID, nsIAccessibleTableCell); |
michael@0 | 25 | } |
michael@0 | 26 | |
michael@0 | 27 | function checkIfNotAccessible(aID) |
michael@0 | 28 | { |
michael@0 | 29 | ok(!isAccessible(aID), "'" + aID + "' shouldn't be accessible"); |
michael@0 | 30 | } |
michael@0 | 31 | function checkIfTDGeneric(aID) |
michael@0 | 32 | { |
michael@0 | 33 | ok(isTDGeneric(aID), "'" + aID + "' shouldn't have cell accessible"); |
michael@0 | 34 | } |
michael@0 | 35 | |
michael@0 | 36 | function doTest() |
michael@0 | 37 | { |
michael@0 | 38 | //////////////////////////////////////////////////////////////////////////// |
michael@0 | 39 | // HTML table elements outside table context. |
michael@0 | 40 | |
michael@0 | 41 | // HTML table role="presentation" |
michael@0 | 42 | checkIfNotAccessible("tr_in_presentation_table"); |
michael@0 | 43 | checkIfTDGeneric("th_in_presentation_table"); |
michael@0 | 44 | checkIfTDGeneric("td_in_presentation_table"); |
michael@0 | 45 | |
michael@0 | 46 | // HTML table role="button" |
michael@0 | 47 | var tree = |
michael@0 | 48 | { PUSHBUTTON: [ // table |
michael@0 | 49 | { NOTHING: [ // tr |
michael@0 | 50 | { NOTHING: [ // th |
michael@0 | 51 | { TEXT_LEAF: [ ] } |
michael@0 | 52 | ] }, |
michael@0 | 53 | { NOTHING: [ // td |
michael@0 | 54 | { TEXT_LEAF: [ ] } |
michael@0 | 55 | ] } |
michael@0 | 56 | ] } |
michael@0 | 57 | ] }; |
michael@0 | 58 | testAccessibleTree("button_table", tree); |
michael@0 | 59 | |
michael@0 | 60 | // HTML table display:inline |
michael@0 | 61 | checkIfNotAccessible("inline_table1"); |
michael@0 | 62 | checkIfNotAccessible("tr_in_inline_table1"); |
michael@0 | 63 | checkIfTDGeneric("td1_in_inline_table1"); |
michael@0 | 64 | checkIfTDGeneric("td2_in_inline_table1"); |
michael@0 | 65 | |
michael@0 | 66 | // HTML table display:inline inside table. We shouldn't be fooled |
michael@0 | 67 | // by the outside table and shouldn't create table accessible and table cell |
michael@0 | 68 | // accessible in this case. |
michael@0 | 69 | checkIfNotAccessible("inline_table2"); |
michael@0 | 70 | checkIfNotAccessible("tr_in_inline_table2"); |
michael@0 | 71 | checkIfTDGeneric("td_in_inline_table2"); |
michael@0 | 72 | |
michael@0 | 73 | // HTML table display:block inside table. |
michael@0 | 74 | checkIfNotAccessible("block_table"); |
michael@0 | 75 | checkIfNotAccessible("tr_in_block_table"); |
michael@0 | 76 | checkIfTDGeneric("td_in_block_table"); |
michael@0 | 77 | |
michael@0 | 78 | //////////////////////////////////////////////////////////////////////////// |
michael@0 | 79 | // HTML list elements outside list context. |
michael@0 | 80 | |
michael@0 | 81 | ok(!isAccessible("presentation_ul"), |
michael@0 | 82 | "presentational ul shouldn't be accessible"); |
michael@0 | 83 | ok(!isAccessible("item_in_presentation_ul"), |
michael@0 | 84 | "li in presentational ul shouldn't be accessible"); |
michael@0 | 85 | ok(!isAccessible("styleditem_in_presentation_ul"), |
michael@0 | 86 | "list styled span in presentational ul shouldn't be accessible"); |
michael@0 | 87 | |
michael@0 | 88 | ok(!isAccessible("presentation_ol"), |
michael@0 | 89 | "presentational ol shouldn't be accessible"); |
michael@0 | 90 | ok(!isAccessible("item_in_presentation_ol"), |
michael@0 | 91 | "li in presentational ol shouldn't be accessible"); |
michael@0 | 92 | |
michael@0 | 93 | ok(!isAccessible("presentation_dl"), |
michael@0 | 94 | "presentational dl shouldn't be accessible"); |
michael@0 | 95 | ok(!isAccessible("dt_in_presentation_dl"), |
michael@0 | 96 | "dt in presentational dl shouldn't be accessible"); |
michael@0 | 97 | ok(!isAccessible("dd_in_presentation_dl"), |
michael@0 | 98 | "dd in presentational dl shouldn't be accessible"); |
michael@0 | 99 | |
michael@0 | 100 | tree = |
michael@0 | 101 | { PUSHBUTTON: [ // ul |
michael@0 | 102 | { NOTHING: [ // li |
michael@0 | 103 | { STATICTEXT: [ ] }, |
michael@0 | 104 | { TEXT_LEAF: [ ] } |
michael@0 | 105 | ] }, |
michael@0 | 106 | { NOTHING: [ // span styled as a list |
michael@0 | 107 | { STATICTEXT: [ ] }, |
michael@0 | 108 | { TEXT_LEAF: [ ] } |
michael@0 | 109 | ] } |
michael@0 | 110 | ] }; |
michael@0 | 111 | testAccessibleTree("button_ul", tree); |
michael@0 | 112 | |
michael@0 | 113 | tree = |
michael@0 | 114 | { PUSHBUTTON: [ // ol |
michael@0 | 115 | { NOTHING: [ // li |
michael@0 | 116 | { STATICTEXT: [ ] }, |
michael@0 | 117 | { TEXT_LEAF: [ ] } |
michael@0 | 118 | ] } |
michael@0 | 119 | ] }; |
michael@0 | 120 | testAccessibleTree("button_ol", tree); |
michael@0 | 121 | |
michael@0 | 122 | tree = |
michael@0 | 123 | { PUSHBUTTON: [ // dl |
michael@0 | 124 | { NOTHING: [ // dt |
michael@0 | 125 | { TEXT_LEAF: [ ] } |
michael@0 | 126 | ] }, |
michael@0 | 127 | { NOTHING: [ // dd |
michael@0 | 128 | { TEXT_LEAF: [ ] } |
michael@0 | 129 | ] } |
michael@0 | 130 | ] }; |
michael@0 | 131 | testAccessibleTree("button_dl", tree); |
michael@0 | 132 | |
michael@0 | 133 | //////////////////////////////////////////////////////////////////////////// |
michael@0 | 134 | // Styled as HTML table elements, accessible is created by tag name |
michael@0 | 135 | |
michael@0 | 136 | tree = |
michael@0 | 137 | { LINK: [ // a |
michael@0 | 138 | { TEXT_LEAF: [ ] } |
michael@0 | 139 | ] }; |
michael@0 | 140 | testAccessibleTree("a_as_td", tree); |
michael@0 | 141 | |
michael@0 | 142 | tree = |
michael@0 | 143 | { HEADING: [ |
michael@0 | 144 | { TEXT_LEAF: [ ] } |
michael@0 | 145 | ] }; |
michael@0 | 146 | testAccessibleTree("h1_as_td", tree); |
michael@0 | 147 | testAccessibleTree("h2_as_td", tree); |
michael@0 | 148 | testAccessibleTree("h3_as_td", tree); |
michael@0 | 149 | testAccessibleTree("h4_as_td", tree); |
michael@0 | 150 | testAccessibleTree("h5_as_td", tree); |
michael@0 | 151 | testAccessibleTree("h6_as_td", tree); |
michael@0 | 152 | |
michael@0 | 153 | SimpleTest.finish(); |
michael@0 | 154 | } |
michael@0 | 155 | |
michael@0 | 156 | SimpleTest.waitForExplicitFinish(); |
michael@0 | 157 | addA11yLoadEvent(doTest); |
michael@0 | 158 | </script> |
michael@0 | 159 | </head> |
michael@0 | 160 | |
michael@0 | 161 | <body> |
michael@0 | 162 | <a target="_blank" |
michael@0 | 163 | href="https://bugzilla.mozilla.org/show_bug.cgi?id=706849" |
michael@0 | 164 | title="Create accessible by tag name as fallback if table descendant style is used out of table context"> |
michael@0 | 165 | Bug 706849 |
michael@0 | 166 | </a> |
michael@0 | 167 | <a target="_blank" |
michael@0 | 168 | href="https://bugzilla.mozilla.org/show_bug.cgi?id=804461" |
michael@0 | 169 | title="Build the context dependent tree "> |
michael@0 | 170 | Bug 804461 |
michael@0 | 171 | </a> |
michael@0 | 172 | <a target="_blank" |
michael@0 | 173 | href="https://bugzilla.mozilla.org/show_bug.cgi?id=945435" |
michael@0 | 174 | title="Create generic accessible for td to not jamm the cell text"> |
michael@0 | 175 | Bug 945435 |
michael@0 | 176 | </a> |
michael@0 | 177 | <p id="display"></p> |
michael@0 | 178 | <div id="content" style="display: none"></div> |
michael@0 | 179 | <pre id="test"> |
michael@0 | 180 | </pre> |
michael@0 | 181 | |
michael@0 | 182 | <!-- HTML table elements out of table --> |
michael@0 | 183 | <table role="presentation"> |
michael@0 | 184 | <tr id="tr_in_presentation_table"> |
michael@0 | 185 | <th id="th_in_presentation_table">not a header</th> |
michael@0 | 186 | <td id="td_in_presentation_table">not a cell</td> |
michael@0 | 187 | </tr> |
michael@0 | 188 | </table> |
michael@0 | 189 | |
michael@0 | 190 | <table role="button" id="button_table"> |
michael@0 | 191 | <tr id="tr_in_button_table"> |
michael@0 | 192 | <th id="th_in_button_table">not a header</th> |
michael@0 | 193 | <td id="td_in_button_table">not a cell</td> |
michael@0 | 194 | </tr> |
michael@0 | 195 | </table> |
michael@0 | 196 | |
michael@0 | 197 | <table id="inline_table1" border="1" style="display:inline"> |
michael@0 | 198 | <tr id="tr_in_inline_table1"> |
michael@0 | 199 | <td id="td1_in_inline_table1">table1 cell1</td> |
michael@0 | 200 | <td id="td2_in_inline_table1">table1 cell2</td> |
michael@0 | 201 | </tr> |
michael@0 | 202 | </table> |
michael@0 | 203 | |
michael@0 | 204 | <table id="table_containing_inlinetable"><tr><td> |
michael@0 | 205 | <table id="inline_table2" border="1" style="display:inline"> |
michael@0 | 206 | <tr id="tr_in_inline_table2"> |
michael@0 | 207 | <td id="td_in_inline_table2">cell</td> |
michael@0 | 208 | </tr> |
michael@0 | 209 | </table> |
michael@0 | 210 | </td></tr></table> |
michael@0 | 211 | |
michael@0 | 212 | <table> |
michael@0 | 213 | <tr> |
michael@0 | 214 | <td style="display:block"> |
michael@0 | 215 | <table id="block_table" style="display:inline"> |
michael@0 | 216 | <tr id="tr_in_block_table"> |
michael@0 | 217 | <td id="td_in_block_table">cell0</td> |
michael@0 | 218 | </tr> |
michael@0 | 219 | </table> |
michael@0 | 220 | </td> |
michael@0 | 221 | <td>cell1</td> |
michael@0 | 222 | </tr> |
michael@0 | 223 | </table> |
michael@0 | 224 | |
michael@0 | 225 | <!-- HTML list elements out of list --> |
michael@0 | 226 | <ul role="presentation" id="presentation_ul"> |
michael@0 | 227 | <li id="item_in_presentation_ul">item</li> |
michael@0 | 228 | <span id="styleditem_in_presentation_ul" |
michael@0 | 229 | style="display:list-item">Oranges</span> |
michael@0 | 230 | </ul> |
michael@0 | 231 | |
michael@0 | 232 | <ol role="presentation" id="presentation_ol"> |
michael@0 | 233 | <li id="item_in_presentation_ol">item</li> |
michael@0 | 234 | </ol> |
michael@0 | 235 | |
michael@0 | 236 | <dl role="presentation" id="presentation_dl"> |
michael@0 | 237 | <dt id="dt_in_presentation_dl">term</dt> |
michael@0 | 238 | <dd id="dd_in_presentation_dl">definition</dd> |
michael@0 | 239 | </dl> |
michael@0 | 240 | |
michael@0 | 241 | <ul role="button" id="button_ul"> |
michael@0 | 242 | <li id="item_in_button_ul">item</li> |
michael@0 | 243 | <span id="styleditem_in_button_ul" |
michael@0 | 244 | style="display:list-item">Oranges</span> |
michael@0 | 245 | </ul> |
michael@0 | 246 | |
michael@0 | 247 | <ol role="button" id="button_ol"> |
michael@0 | 248 | <li id="item_in_button_ul">item</li> |
michael@0 | 249 | </ol> |
michael@0 | 250 | |
michael@0 | 251 | <dl role="button" id="button_dl"> |
michael@0 | 252 | <dt id="dt_in_button_dl">term</ld> |
michael@0 | 253 | <dd id="dd_in_button_dl">definition</dd> |
michael@0 | 254 | </dl> |
michael@0 | 255 | |
michael@0 | 256 | <!-- styled as HTML table elements --> |
michael@0 | 257 | <a id="a_as_td" style="display:table-cell;" href="http://www.google.com">Google</a> |
michael@0 | 258 | <h1 id="h1_as_td" style="display: table-cell;">h1</h1> |
michael@0 | 259 | <h2 id="h2_as_td" style="display: table-cell;">h2</h2> |
michael@0 | 260 | <h3 id="h3_as_td" style="display: table-cell;">h3</h3> |
michael@0 | 261 | <h4 id="h4_as_td" style="display: table-cell;">h4</h4> |
michael@0 | 262 | <h5 id="h5_as_td" style="display: table-cell;">h5</h5> |
michael@0 | 263 | <h6 id="h6_as_td" style="display: table-cell;">h6</h6> |
michael@0 | 264 | </body> |
michael@0 | 265 | </html> |