test_obj_group.html (20590B)
1 <html> 2 3 <head> 4 <title>Group attributes 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 10 <script type="application/javascript" 11 src="../common.js"></script> 12 <script type="application/javascript" 13 src="../attributes.js"></script> 14 <script type="application/javascript" 15 src="../events.js"></script> 16 17 <script type="application/javascript"> 18 function doTest() { 19 // //////////////////////////////////////////////////////////////////////// 20 // HTML select with no size attribute. 21 testGroupAttrs("opt1-nosize", 1, 4); 22 testGroupAttrs("opt2-nosize", 2, 4); 23 testGroupAttrs("opt3-nosize", 3, 4); 24 testGroupAttrs("opt4-nosize", 4, 4); 25 26 // Container should have item count and not hierarchical 27 testGroupParentAttrs(getAccessible("opt1-nosize").parent, 4, false); 28 29 // //////////////////////////////////////////////////////////////////////// 30 // HTML select 31 testGroupAttrs("opt1", 1, 2); 32 testGroupAttrs("opt2", 2, 2); 33 34 // //////////////////////////////////////////////////////////////////////// 35 // HTML select with optgroup 36 testGroupAttrs("select2_opt3", 1, 2, 1); 37 testGroupAttrs("select2_opt4", 2, 2, 1); 38 testGroupAttrs("select2_opt1", 1, 2, 2); 39 testGroupAttrs("select2_opt2", 2, 2, 2); 40 41 // //////////////////////////////////////////////////////////////////////// 42 // HTML input@type="radio" within form 43 testGroupAttrs("radio1", 1, 2); 44 testGroupAttrs("radio2", 2, 2); 45 46 // //////////////////////////////////////////////////////////////////////// 47 // HTML input@type="radio" within document 48 testGroupAttrs("radio3", 1, 2); 49 testGroupAttrs("radio4", 2, 2); 50 51 // //////////////////////////////////////////////////////////////////////// 52 // Hidden HTML input@type="radio" 53 testGroupAttrs("radio5", 1, 1); 54 55 // //////////////////////////////////////////////////////////////////////// 56 // HTML ul/ol 57 testGroupAttrs("li1", 1, 3); 58 testGroupAttrs("li2", 2, 3); 59 testGroupAttrs("li3", 3, 3); 60 61 // ul should have item count and not hierarchical 62 testGroupParentAttrs("ul", 3, false); 63 64 // //////////////////////////////////////////////////////////////////////// 65 // HTML ul/ol (nested lists) 66 67 testGroupAttrs("li4", 1, 3, 1); 68 testGroupAttrs("li5", 2, 3, 1); 69 testGroupAttrs("li6", 3, 3, 1); 70 // ol with nested list should have 1st level item count and be hierarchical 71 testGroupParentAttrs("ol", 3, true); 72 73 testGroupAttrs("n_li4", 1, 3, 2); 74 testGroupAttrs("n_li5", 2, 3, 2); 75 testGroupAttrs("n_li6", 3, 3, 2); 76 // nested ol should have item count and be hierarchical 77 testGroupParentAttrs("ol_nested", 3, true); 78 79 // //////////////////////////////////////////////////////////////////////// 80 // ARIA list 81 testGroupAttrs("li7", 1, 3); 82 testGroupAttrs("li8", 2, 3); 83 testGroupAttrs("li9", 3, 3); 84 // simple flat aria list 85 testGroupParentAttrs("aria-list_1", 3, false); 86 87 // //////////////////////////////////////////////////////////////////////// 88 // ARIA list (nested lists: list -> listitem -> list -> listitem) 89 testGroupAttrs("li10", 1, 3, 1); 90 testGroupAttrs("li11", 2, 3, 1); 91 testGroupAttrs("li12", 3, 3, 1); 92 // aria list with nested list 93 testGroupParentAttrs("aria-list_2", 3, true); 94 95 testGroupAttrs("n_li10", 1, 3, 2); 96 testGroupAttrs("n_li11", 2, 3, 2); 97 testGroupAttrs("n_li12", 3, 3, 2); 98 // nested aria list. 99 testGroupParentAttrs("aria-list_2_1", 3, true); 100 101 // //////////////////////////////////////////////////////////////////////// 102 // ARIA list (nested lists: list -> listitem -> group -> listitem) 103 testGroupAttrs("lgt_li1", 1, 2, 1); 104 testGroupAttrs("lgt_li1_nli1", 1, 2, 2); 105 testGroupAttrs("lgt_li1_nli2", 2, 2, 2); 106 testGroupAttrs("lgt_li2", 2, 2, 1); 107 testGroupAttrs("lgt_li2_nli1", 1, 2, 2); 108 testGroupAttrs("lgt_li2_nli2", 2, 2, 2); 109 // aria list with nested list 110 testGroupParentAttrs("aria-list_3", 2, true); 111 112 // //////////////////////////////////////////////////////////////////////// 113 // ARIA menu (menuitem, separator, menuitemradio and menuitemcheckbox) 114 testGroupAttrs("menu_item1", 1, 2); 115 testGroupAttrs("menu_item2", 2, 2); 116 testGroupAttrs("menu_item1.1", 1, 2); 117 testGroupAttrs("menu_item1.2", 2, 2); 118 testGroupAttrs("menu_item1.3", 1, 3); 119 testGroupAttrs("menu_item1.4", 2, 3); 120 testGroupAttrs("menu_item1.5", 3, 3); 121 // menu bar item count 122 testGroupParentAttrs("menubar", 2, false); 123 // Bug 1492529. Menu should have total number of items 5 from both sets, 124 // but only has the first 2 item set. 125 todoAttr("menu", "child-item-count", "5"); 126 127 // //////////////////////////////////////////////////////////////////////// 128 // ARIA tab 129 testGroupAttrs("tab_1", 1, 3); 130 testGroupAttrs("tab_2", 2, 3); 131 testGroupAttrs("tab_3", 3, 3); 132 // tab list tab count 133 testGroupParentAttrs("tablist_1", 3, false); 134 135 // //////////////////////////////////////////////////////////////////////// 136 // ARIA radio 137 testGroupAttrs("r1", 1, 3); 138 testGroupAttrs("r2", 2, 3); 139 testGroupAttrs("r3", 3, 3); 140 // explicit aria radio group 141 testGroupParentAttrs("rg1", 3, false); 142 143 // //////////////////////////////////////////////////////////////////////// 144 // ARIA tree 145 testGroupAttrs("ti1", 1, 3, 1); 146 testGroupAttrs("ti2", 1, 2, 2); 147 testGroupAttrs("ti3", 2, 2, 2); 148 testGroupAttrs("ti4", 2, 3, 1); 149 testGroupAttrs("ti5", 1, 3, 2); 150 testGroupAttrs("ti6", 2, 3, 2); 151 testGroupAttrs("ti7", 3, 3, 2); 152 testGroupAttrs("ti8", 3, 3, 1); 153 testGroupParentAttrs("tree_1", 3, true); 154 155 // //////////////////////////////////////////////////////////////////////// 156 // ARIA tree (tree -> treeitem -> group -> treeitem) 157 testGroupAttrs("tree2_ti1", 1, 2, 1); 158 testGroupAttrs("tree2_ti1a", 1, 2, 2); 159 testGroupAttrs("tree2_ti1b", 2, 2, 2); 160 testGroupAttrs("tree2_ti2", 2, 2, 1); 161 testGroupAttrs("tree2_ti2a", 1, 2, 2); 162 testGroupAttrs("tree2_ti2b", 2, 2, 2); 163 testGroupParentAttrs("tree_2", 2, true); 164 165 // //////////////////////////////////////////////////////////////////////// 166 // ARIA tree (tree -> treeitem, group -> treeitem) 167 testGroupAttrs("tree3_ti1", 1, 2, 1); 168 testGroupAttrs("tree3_ti1a", 1, 2, 2); 169 testGroupAttrs("tree3_ti1b", 2, 2, 2); 170 testGroupAttrs("tree3_ti2", 2, 2, 1); 171 testGroupAttrs("tree3_ti2a", 1, 2, 2); 172 testGroupAttrs("tree3_ti2b", 2, 2, 2); 173 testGroupParentAttrs("tree_3", 2, true); 174 175 // //////////////////////////////////////////////////////////////////////// 176 // ARIA grid 177 testGroupAttrs("grid_row1", 1, 2); 178 testAbsentAttrs("grid_cell1", {"posinset": "", "setsize": ""}); 179 testAbsentAttrs("grid_cell2", {"posinset": "", "setsize": ""}); 180 181 testGroupAttrs("grid_row2", 2, 2); 182 testAbsentAttrs("grid_cell3", {"posinset": "", "setsize": ""}); 183 testAbsentAttrs("grid_cell4", {"posinset": "", "setsize": ""}); 184 testGroupParentAttrs("grid", 2, false); 185 186 // //////////////////////////////////////////////////////////////////////// 187 // ARIA treegrid 188 testGroupAttrs("treegrid_row1", 1, 2, 1); 189 testAbsentAttrs("treegrid_cell1", {"posinset": "", "setsize": ""}); 190 testAbsentAttrs("treegrid_cell2", {"posinset": "", "setsize": ""}); 191 192 testGroupAttrs("treegrid_row2", 1, 1, 2); 193 testAbsentAttrs("treegrid_cell3", {"posinset": "", "setsize": ""}); 194 testAbsentAttrs("treegrid_cell4", {"posinset": "", "setsize": ""}); 195 196 testGroupAttrs("treegrid_row3", 2, 2, 1); 197 testAbsentAttrs("treegrid_cell5", {"posinset": "", "setsize": ""}); 198 testAbsentAttrs("treegrid_cell6", {"posinset": "", "setsize": ""}); 199 200 testGroupParentAttrs("treegrid", 2, true); 201 // row child item count provided by parent grid's aria-colcount 202 testGroupParentAttrs("treegrid_row1", 4, false); 203 204 // //////////////////////////////////////////////////////////////////////// 205 // HTML headings 206 testGroupAttrs("h1", 0, 0, 1); 207 testGroupAttrs("h2", 0, 0, 2); 208 testGroupAttrs("h3", 0, 0, 3); 209 testGroupAttrs("h4", 0, 0, 4); 210 testGroupAttrs("h5", 0, 0, 5); 211 testGroupAttrs("h6", 0, 0, 6); 212 testGroupAttrs("ariaHeadingNoLevel", 0, 0, 2); 213 // No child item counts or "tree" flag for parent of headings 214 testAbsentAttrs("headings", {"child-item-count": "", "tree": ""}); 215 216 // //////////////////////////////////////////////////////////////////////// 217 // ARIA combobox 218 testGroupAttrs("combo1_opt1", 1, 4); 219 testGroupAttrs("combo1_opt2", 2, 4); 220 testGroupAttrs("combo1_opt3", 3, 4); 221 testGroupAttrs("combo1_opt4", 4, 4); 222 testGroupParentAttrs("combo1", 4, false); 223 224 // //////////////////////////////////////////////////////////////////////// 225 // ARIA table 226 testGroupAttrs("table_cell", 3, 4); 227 testGroupAttrs("table_row", 2, 2); 228 229 // grid child item count provided by aria-rowcount 230 testGroupParentAttrs("table", 2, false); 231 // row child item count provided by parent grid's aria-colcount 232 testGroupParentAttrs("table_row", 4, false); 233 234 // Attributes calculated even when row is wrapped in a div. 235 testGroupAttrs("wrapped_row_1", 1, 2); 236 testGroupAttrs("wrapped_row_2", 2, 2); 237 238 // //////////////////////////////////////////////////////////////////////// 239 // ARIA list constructed by ARIA owns 240 testGroupAttrs("t1_li1", 1, 3); 241 testGroupAttrs("t1_li2", 2, 3); 242 testGroupAttrs("t1_li3", 3, 3); 243 testGroupParentAttrs("aria-list_4", 3, false); 244 245 // Test group attributes of ARIA comments 246 testGroupAttrs("comm_single_1", 1, 2, 1); 247 testGroupAttrs("comm_single_2", 2, 2, 1); 248 testGroupAttrs("comm_nested_1", 1, 3, 1); 249 testGroupAttrs("comm_nested_1_1", 1, 2, 2); 250 testGroupAttrs("comm_nested_1_2", 2, 2, 2); 251 testGroupAttrs("comm_nested_2", 2, 3, 1); 252 testGroupAttrs("comm_nested_2_1", 1, 1, 2); 253 testGroupAttrs("comm_nested_2_1_1", 1, 1, 3); 254 testGroupAttrs("comm_nested_3", 3, 3, 1); 255 256 // Test that group position information updates after deleting node. 257 testGroupAttrs("tree4_ti1", 1, 2, 1); 258 testGroupAttrs("tree4_ti2", 2, 2, 1); 259 testGroupParentAttrs("tree4", 2, true); 260 261 var tree4element = document.getElementById("tree4_ti1"); 262 var tree4acc = getAccessible("tree4"); 263 tree4element.remove(); 264 waitForEvent(EVENT_REORDER, tree4acc, function() { 265 testGroupAttrs("tree4_ti2", 1, 1, 1); 266 testGroupParentAttrs("tree4", 1, true); 267 SimpleTest.finish(); 268 }); 269 } 270 271 SimpleTest.waitForExplicitFinish(); 272 addA11yLoadEvent(doTest); 273 </script> 274 </head> 275 <body> 276 277 <a target="_blank" 278 href="https://bugzilla.mozilla.org/show_bug.cgi?id=468418" 279 title="Expose level for nested lists in HTML"> 280 Mozilla Bug 468418 281 </a> 282 <a target="_blank" 283 href="https://bugzilla.mozilla.org/show_bug.cgi?id=844023" 284 title="group info might not be properly updated when flat trees mutate"> 285 Bug 844023 286 </a> 287 <a target="_blank" 288 href="https://bugzilla.mozilla.org/show_bug.cgi?id=864224" 289 title="Support nested ARIA listitems structured by role='group'"> 290 Bug 864224 291 </a> 292 <a target="_blank" 293 href="https://bugzilla.mozilla.org/show_bug.cgi?id=907682" 294 title=" HTML:option group position is not correct when select is collapsed"> 295 Mozilla Bug 907682 296 </a> 297 298 <p id="display"></p> 299 <div id="content" style="display: none"></div> 300 <pre id="test"> 301 </pre> 302 303 <select> 304 <option id="opt1-nosize">option1</option> 305 <option id="opt2-nosize">option2</option> 306 <option id="opt3-nosize">option3</option> 307 <option id="opt4-nosize">option4</option> 308 </select> 309 310 <select size="4"> 311 <option id="opt1">option1</option> 312 <option id="opt2">option2</option> 313 </select> 314 315 <select size="4"> 316 <optgroup id="select2_optgroup" label="group"> 317 <option id="select2_opt1">option1</option> 318 <option id="select2_opt2">option2</option> 319 </optgroup> 320 <option id="select2_opt3">option3</option> 321 <option id="select2_opt4">option4</option> 322 </select> 323 324 <form> 325 <input type="radio" id="radio1" name="group1"/> 326 <input type="radio" id="radio2" name="group1"/> 327 </form> 328 329 <input type="radio" id="radio3" name="group2"/> 330 <input type="radio" id="radio4" name="group2"/> 331 332 <ul id="ul"> 333 <li id="li1">Oranges</li> 334 <li id="li2">Apples</li> 335 <li id="li3">Bananas</li> 336 </ul> 337 338 <ol id="ol"> 339 <li id="li4">Oranges</li> 340 <li id="li5">Apples</li> 341 <li id="li6">Bananas 342 <ul id="ol_nested"> 343 <li id="n_li4">Oranges</li> 344 <li id="n_li5">Apples</li> 345 <li id="n_li6">Bananas</li> 346 </ul> 347 </li> 348 </ol> 349 350 <span role="list" id="aria-list_1"> 351 <span role="listitem" id="li7">Oranges</span> 352 <span role="listitem" id="li8">Apples</span> 353 <span role="listitem" id="li9">Bananas</span> 354 </span> 355 356 <span role="list" id="aria-list_2"> 357 <span role="listitem" id="li10">Oranges</span> 358 <span role="listitem" id="li11">Apples</span> 359 <span role="listitem" id="li12">Bananas 360 <span role="list" id="aria-list_2_1"> 361 <span role="listitem" id="n_li10">Oranges</span> 362 <span role="listitem" id="n_li11">Apples</span> 363 <span role="listitem" id="n_li12">Bananas</span> 364 </span> 365 </span> 366 </span> 367 368 <div role="list" id="aria-list_3"> 369 <div role="listitem" id="lgt_li1">Item 1 370 <div role="group"> 371 <div role="listitem" id="lgt_li1_nli1">Item 1A</div> 372 <div role="listitem" id="lgt_li1_nli2">Item 1B</div> 373 </div> 374 </div> 375 <div role="listitem" id="lgt_li2">Item 2 376 <div role="group"> 377 <div role="listitem" id="lgt_li2_nli1">Item 2A</div> 378 <div role="listitem" id="lgt_li2_nli2">Item 2B</div> 379 </div> 380 </div> 381 </div> 382 383 <ul role="menubar" id="menubar"> 384 <li role="menuitem" aria-haspopup="true" id="menu_item1">File 385 <ul role="menu" id="menu"> 386 <li role="menuitem" id="menu_item1.1">New</li> 387 <li role="menuitem" id="menu_item1.2">Open…</li> 388 <li role="separator">-----</li> 389 <li role="menuitem" id="menu_item1.3">Item</li> 390 <li role="menuitemradio" id="menu_item1.4">Radio</li> 391 <li role="menuitemcheckbox" id="menu_item1.5">Checkbox</li> 392 </ul> 393 </li> 394 <li role="menuitem" aria-haspopup="false" id="menu_item2">Help</li> 395 </ul> 396 397 <ul id="tablist_1" role="tablist"> 398 <li id="tab_1" role="tab">Crust</li> 399 <li id="tab_2" role="tab">Veges</li> 400 <li id="tab_3" role="tab">Carnivore</li> 401 </ul> 402 403 <ul id="rg1" role="radiogroup"> 404 <li id="r1" role="radio" aria-checked="false">Thai</li> 405 <li id="r2" role="radio" aria-checked="false">Subway</li> 406 <li id="r3" role="radio" aria-checked="false">Jimmy Johns</li> 407 </ul> 408 409 <table role="tree" id="tree_1"> 410 <tr role="presentation"> 411 <td role="treeitem" aria-expanded="true" aria-level="1" 412 id="ti1">vegetables</td> 413 </tr> 414 <tr role="presentation"> 415 <td role="treeitem" aria-level="2" id="ti2">cucumber</td> 416 </tr> 417 <tr role="presentation"> 418 <td role="treeitem" aria-level="2" id="ti3">carrot</td> 419 </tr> 420 <tr role="presentation"> 421 <td role="treeitem" aria-expanded="false" aria-level="1" 422 id="ti4">cars</td> 423 </tr> 424 <tr role="presentation"> 425 <td role="treeitem" aria-level="2" id="ti5">mercedes</td> 426 </tr> 427 <tr role="presentation"> 428 <td role="treeitem" aria-level="2" id="ti6">BMW</td> 429 </tr> 430 <tr role="presentation"> 431 <td role="treeitem" aria-level="2" id="ti7">Audi</td> 432 </tr> 433 <tr role="presentation"> 434 <td role="treeitem" aria-level="1" id="ti8">people</td> 435 </tr> 436 </table> 437 438 <ul role="tree" id="tree_2"> 439 <li role="treeitem" id="tree2_ti1">Item 1 440 <ul role="group"> 441 <li role="treeitem" id="tree2_ti1a">Item 1A</li> 442 <li role="treeitem" id="tree2_ti1b">Item 1B</li> 443 </ul> 444 </li> 445 <li role="treeitem" id="tree2_ti2">Item 2 446 <ul role="group"> 447 <li role="treeitem" id="tree2_ti2a">Item 2A</li> 448 <li role="treeitem" id="tree2_ti2b">Item 2B</li> 449 </ul> 450 </li> 451 </div> 452 453 <div role="tree" id="tree_3"> 454 <div role="treeitem" id="tree3_ti1">Item 1</div> 455 <div role="group"> 456 <li role="treeitem" id="tree3_ti1a">Item 1A</li> 457 <li role="treeitem" id="tree3_ti1b">Item 1B</li> 458 </div> 459 <div role="treeitem" id="tree3_ti2">Item 2</div> 460 <div role="group"> 461 <div role="treeitem" id="tree3_ti2a">Item 2A</div> 462 <div role="treeitem" id="tree3_ti2b">Item 2B</div> 463 </div> 464 </div> 465 466 <!-- IMPORTANT: Need to have no whitespace between elements in this tree. --> 467 <div role="tree" id="tree4"><div role="treeitem" 468 id="tree4_ti1">Item 1</div><div role="treeitem" 469 id="tree4_ti2">Item 2</div></div> 470 471 <table role="grid" id="grid"> 472 <tr role="row" id="grid_row1"> 473 <td role="gridcell" id="grid_cell1">cell1</td> 474 <td role="gridcell" id="grid_cell2">cell2</td> 475 </tr> 476 <tr role="row" id="grid_row2"> 477 <td role="gridcell" id="grid_cell3">cell3</td> 478 <td role="gridcell" id="grid_cell4">cell4</td> 479 </tr> 480 </table> 481 482 <div role="treegrid" id="treegrid" aria-colcount="4"> 483 <div role="row" aria-level="1" id="treegrid_row1"> 484 <div role="gridcell" id="treegrid_cell1">cell1</div> 485 <div role="gridcell" id="treegrid_cell2">cell2</div> 486 </div> 487 <div role="row" aria-level="2" id="treegrid_row2"> 488 <div role="gridcell" id="treegrid_cell3">cell1</div> 489 <div role="gridcell" id="treegrid_cell4">cell2</div> 490 </div> 491 <div role="row" id="treegrid_row3"> 492 <div role="gridcell" id="treegrid_cell5">cell1</div> 493 <div role="gridcell" id="treegrid_cell6">cell2</div> 494 </div> 495 </div> 496 497 <div id="headings"> 498 <h1 id="h1">heading1</h1> 499 <h2 id="h2">heading2</h2> 500 <h3 id="h3">heading3</h3> 501 <h4 id="h4">heading4</h4> 502 <h5 id="h5">heading5</h5> 503 <h6 id="h6">heading6</h6> 504 <div id="ariaHeadingNoLevel" role="heading">ariaHeadingNoLevel</div> 505 </div> 506 507 <ul id="combo1" role="combobox">Password 508 <li id="combo1_opt1" role="option">Xyzzy</li> 509 <li id="combo1_opt2" role="option">Plughs</li> 510 <li id="combo1_opt3" role="option">Shazaam</li> 511 <li id="combo1_opt4" role="option">JoeSentMe</li> 512 </ul> 513 514 <form> 515 <input type="radio" style="display: none;" name="group3"> 516 <input type="radio" id="radio5" name="group3"> 517 </form> 518 519 <div role="table" aria-colcount="4" aria-rowcount="2" id="table"> 520 <div role="row" id="table_row" aria-rowindex="2"> 521 <div role="cell" id="table_cell" aria-colindex="3">cell</div> 522 </div> 523 </div> 524 525 <div role="grid" aria-readonly="true"> 526 <div tabindex="-1"> 527 <div role="row" id="wrapped_row_1"> 528 <div role="gridcell">cell content</div> 529 </div> 530 </div> 531 <div tabindex="-1"> 532 <div role="row" id="wrapped_row_2"> 533 <div role="gridcell">cell content</div> 534 </div> 535 </div> 536 </div> 537 538 <div role="list" aria-owns="t1_li1 t1_li2 t1_li3" id="aria-list_4"> 539 <div role="listitem" id="t1_li2">Apples</div> 540 <div role="listitem" id="t1_li1">Oranges</div> 541 </div> 542 <div role="listitem" id="t1_li3">Bananas</div> 543 544 <!-- ARIA comments, 1 level, group pos and size calculation --> 545 <article> 546 <p id="comm_single_1" role="comment">Comment 1</p> 547 <p id="comm_single_2" role="comment">Comment 2</p> 548 </article> 549 550 <!-- Nested comments --> 551 <article> 552 <div id="comm_nested_1" role="comment"><p>Comment 1 level 1</p> 553 <div id="comm_nested_1_1" role="comment"><p>Comment 1 level 2</p></div> 554 <div id="comm_nested_1_2" role="comment"><p>Comment 2 level 2</p></div> 555 </div> 556 <div id="comm_nested_2" role="comment"><p>Comment 2 level 1</p> 557 <div id="comm_nested_2_1" role="comment"><p>Comment 3 level 2</p> 558 <div id="comm_nested_2_1_1" role="comment"><p>Comment 1 level 3</p></div> 559 </div> 560 </div> 561 <div id="comm_nested_3" role="comment"><p>Comment 3 level 1</p></div> 562 </article> 563 </body> 564 </html>