test_aria_table.html (2417B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>ARIA table 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="../role.js"></script> 14 15 <script type="application/javascript"> 16 function doTest() { 17 // //////////////////////////////////////////////////////////////////////// 18 // table having rowgroups 19 20 var accTree = 21 { TABLE: [ 22 { ROWGROUP: [ 23 { ROW: [ 24 { CELL: [ 25 { TEXT_LEAF: [ ] }, 26 ] }, 27 ] }, 28 ] }, 29 ] }; 30 31 testAccessibleTree("table", accTree); 32 33 // tables that could contain text container accessibles but shouldn't. 34 35 accTree = 36 { TABLE: [ 37 { ROW: [ 38 { CELL: [ 39 { TEXT_LEAF: [ ] }, 40 ] }, 41 { CELL: [ 42 { TEXT_LEAF: [ ] }, 43 ] }, 44 ] }, 45 { ROW: [ 46 { CELL: [ 47 { TEXT_LEAF: [ ] }, 48 ] }, 49 { CELL: [ 50 { TEXT_LEAF: [ ] }, 51 ] }, 52 ] }, 53 ] }; 54 55 testAccessibleTree("tableWithPresentationalBlockElement", accTree); 56 57 SimpleTest.finish(); 58 } 59 60 SimpleTest.waitForExplicitFinish(); 61 addA11yLoadEvent(doTest); 62 </script> 63 </head> 64 <body> 65 66 <a target="_blank" 67 title="support ARIA table and cell roles" 68 href="https://bugzilla.mozilla.org/show_bug.cgi?id=1173364"> 69 Bug 1173364 70 </a> 71 <p id="display"></p> 72 <div id="content" style="display: none"></div> 73 <pre id="test"> 74 </pre> 75 76 <div id="table" role="table"> 77 <div role="rowgroup"> 78 <div role="row"> 79 <div role="cell">cell</div> 80 </div> 81 </div> 82 </div> 83 84 <div id="tableWithPresentationalBlockElement" role="table"> 85 <span style="display: block;"> 86 <div role="row"> 87 <div role="cell">Cell 1</div> 88 <div role="cell">Cell 2</div> 89 </div> 90 </span> 91 <span style="display: block;"> 92 <div role="row"> 93 <span style="display: block;"> 94 <div role="cell">Cell 3</div> 95 <div role="cell">Cell 4</div> 96 </span> 97 </div> 98 </span> 99 </div> 100 </body> 101 </html>