test_table_mutation.html (2410B)
1 <!DOCTYPE HTML PUBLIC "-//w3c//dtd html 4.0 transitional//en"> 2 <html> 3 <head> 4 <title>Table mutation</title> 5 <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 6 <link rel="stylesheet" type="text/css" 7 href="chrome://mochikit/content/tests/SimpleTest/test.css" /> 8 9 <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> 10 11 <script type="application/javascript" 12 src="../common.js"></script> 13 <script type="application/javascript" 14 src="../table.js"></script> 15 <script type="application/javascript" 16 src="../promisified-events.js"></script> 17 18 <script type="application/javascript"> 19 20 async function doTest() { 21 let headers = [ 22 { 23 cell: "t1r1c1", 24 columnHeaderCells: [], 25 rowHeaderCells: [], 26 }, 27 // t1r2 is hidden 28 { 29 cell: "t1r3c1", 30 columnHeaderCells: ["t1r1c1"], 31 rowHeaderCells: [], 32 }, 33 ]; 34 testHeaderCells(headers); 35 36 info("Remove row"); 37 let reordered = waitForEvent(EVENT_REORDER, "t1"); 38 getNode("t1r1").hidden = true; 39 await reordered; 40 headers = [ 41 // t1r1 and t1r2 are hidden 42 { 43 cell: "t1r3c1", 44 columnHeaderCells: [], 45 rowHeaderCells: [], 46 }, 47 ]; 48 testHeaderCells(headers); 49 50 info("Add rows"); 51 reordered = waitForEvent(EVENT_REORDER, "t1"); 52 getNode("t1r1").hidden = false; 53 getNode("t1r2").hidden = false; 54 await reordered; 55 headers = [ 56 { 57 cell: "t1r1c1", 58 columnHeaderCells: [], 59 rowHeaderCells: [], 60 }, 61 { 62 cell: "t1r2c1", 63 columnHeaderCells: ["t1r1c1"], 64 rowHeaderCells: [], 65 }, 66 { 67 cell: "t1r3c1", 68 columnHeaderCells: ["t1r2c1", "t1r1c1"], 69 rowHeaderCells: [], 70 }, 71 ]; 72 testHeaderCells(headers); 73 74 SimpleTest.finish(); 75 } 76 77 SimpleTest.waitForExplicitFinish(); 78 addA11yLoadEvent(doTest); 79 </script> 80 </head> 81 82 <body> 83 <p id="display"></p> 84 <div id="content" style="display: none"></div> 85 <pre id="test"> 86 </pre> 87 88 <table id="t1"> 89 <tr id="t1r1"> 90 <th id="t1r1c1"></th> 91 </tr> 92 <tr id="t1r2" hidden> 93 <th id="t1r2c1"></th> 94 </tr> 95 <tr id="t1r3"> 96 <td id="t1r3c1"></td> 97 </tr> 98 </table> 99 </body> 100 </html>