test_mtable.html (4119B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>MathML 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 <script type="application/javascript" 15 src="../table.js"></script> 16 17 <script type="application/javascript"> 18 function doTest() { 19 // 'Simple' table 20 var idxes = [ 21 [0, 1], 22 [2, 3], 23 ]; 24 testTableIndexes("simple", idxes); 25 var cellsArray = [ 26 [kDataCell, kDataCell], 27 [kDataCell, kDataCell], 28 ]; 29 var rowsArray = [ROLE_MATHML_TABLE_ROW, ROLE_MATHML_TABLE_ROW]; 30 testTableStruct("simple", cellsArray, kNoColumnHeader, 31 "", "", kMathTable, rowsArray); 32 33 // 'Complex' table 34 idxes = [ 35 [0, 0, 0], 36 [1, 1, 2], 37 [1, 1, 3], 38 ]; 39 testTableIndexes("complex", idxes); 40 cellsArray = [ 41 [kDataCell, kColSpanned, kColSpanned], 42 [kDataCell, kColSpanned, kDataCell], 43 [kRowSpanned, kSpanned, kDataCell], 44 ]; 45 rowsArray = [ 46 ROLE_MATHML_TABLE_ROW, 47 ROLE_MATHML_TABLE_ROW, 48 ROLE_MATHML_TABLE_ROW, 49 ]; 50 testTableStruct("complex", cellsArray, kNoColumnHeader, 51 "", "", kMathTable, rowsArray); 52 53 // 'Simple' table with mlabeledtr 54 // At the moment we do not implement mlabeledtr but just hide the label 55 // with display: none. Thus we just test the role for now. See bug 689641. 56 idxes = [[0]]; 57 testTableIndexes("simple_label", idxes); 58 cellsArray = [[kDataCell]]; 59 rowsArray = [ROLE_MATHML_LABELED_ROW]; 60 testTableStruct("simple_label", cellsArray, kNoColumnHeader, 61 "", "", kMathTable, rowsArray); 62 63 // Test that a non-table display style still generates the proper 64 // roles in the accessibility tree. 65 const table_tree = { 66 MATHML_TABLE: [{ 67 MATHML_TABLE_ROW: [{ MATHML_CELL: [{ TEXT_LEAF: [] }] }] 68 }], 69 }; 70 testAccessibleTree("table_with_display_block_mtd", table_tree); 71 72 // Equivalent to the above test but with display: block mtr. 73 testAccessibleTree("table_with_display_block_mtr", table_tree); 74 75 // Equivalent to the above test but with display: block mtable. 76 testAccessibleTree("table_with_display_block", table_tree); 77 78 SimpleTest.finish(); 79 } 80 81 SimpleTest.waitForExplicitFinish(); 82 addA11yLoadEvent(doTest); 83 </script> 84 </head> 85 <body> 86 <p id="display"></p> 87 <div id="content" style="display: none"></div> 88 <pre id="test"> 89 </pre> 90 91 <math> 92 <mtable id="simple"> 93 <mtr> 94 <mtd> 95 <mn>1</mn> 96 </mtd> 97 <mtd> 98 <mn>0</mn> 99 </mtd> 100 </mtr> 101 <mtr> 102 <mtd> 103 <mn>0</mn> 104 </mtd> 105 <mtd> 106 <mn>1</mn> 107 </mtd> 108 </mtr> 109 </mtable> 110 111 <mtable id="complex"> 112 <mtr> 113 <mtd columnspan="3"> 114 <mtext>1 x 3</mtext> 115 </mtd> 116 </mtr> 117 <mtr> 118 <mtd rowspan="2" columnspan="2"> 119 <mtext>2 x 2</mtext> 120 </mtd> 121 <mtd> 122 <mtext>1 x 1</mtext> 123 </mtd> 124 </mtr> 125 <mtr> 126 <mtd> 127 <mtext>1 x 1</mtext> 128 </mtd> 129 </mtr> 130 </mtable> 131 132 <mtable id="simple_label"> 133 <mlabeledtr> 134 <mtd><mtext>1</mtext></mtd> 135 <mtd><mtext>label</mtext></mtd> 136 </mlabeledtr> 137 </mtable> 138 139 <mtable id="table_with_display_block_mtd"> 140 <mtr> 141 <mtd style="display: block">test</mtd> 142 </mtr> 143 </mtable> 144 145 <mtable id="table_with_display_block_mtr"> 146 <mtr style="display: block"> 147 <mtd>test</mtd> 148 </mtr> 149 </mtable> 150 151 <mtable id="table_with_display_block" style="display: block"> 152 <mtr> 153 <mtd>test</mtd> 154 </mtr> 155 </mtable> 156 157 </math> 158 159 </body> 160 </html>