third_party/WebKit/LayoutTests/fast/table/table-insert-before-non-anonymous-block.html

   1 <!DOCTYPE html>
   2 <html>
   3 <body style="font-family: Ahem; -webkit-font-smoothing: none;">
   4 <style>
   5     div.table { display: table; }
   6     div.section { display: table-row-group; }
   7     div.caption { display: table-caption; }
   8     div.colgroup { display: table-column-group; }
   9     div.col { display: table-column; }
  10     div.cell { display: table-cell; width: 50px; height: 50px; background-color: blue; }
  11     div.row { display: table-row; }
  12     div.block { width: 50px; height: 50px; background-color: blue; }
  13 </style>
  14
  15 <div class="table" id="table-1">
  16     <div class="cell"></div>
  17     <div class="section" id="tbody-1">
  18     </div>
  19 </div>
  20
  21 <div class="table" id="table-2">
  22     <div class="cell"></div>
  23     <div class="row" id="row"></div>
  24 </div>
  25
  26 <div class="table" id="table-3">
  27     <div class="cell"></div>
  28     <div class="caption" id="caption">
  29     </div>
  30 </div>
  31
  32 <div class="table" id="table-4">
  33     <div class="cell"></div>
  34     <div class="colgroup" id="colgroup">
  35     </div>
  36 </div>
  37
  38 <div class="table" id="table-5">
  39     <div class="cell"></div>
  40     <div class="section" id="tbody-5">
  41     </div>
  42 </div>
  43
  44 <div class="table" id="table-6">
  45     <div class="cell"></div>
  46     <div class="col" id="col-6">
  47     </div>
  48 </div>
  49
  50 <div class="table" id="table-7">
  51     <div class="cell"></div>
  52     <div id="block">
  53     </div>
  54 </div>
  55
  56 <div class="table" id="table-8">
  57     <div class="block"></div>
  58     <div class="cell" id="cell"></div>
  59 </div>
  60
  61 <script>
  62     function createCell()
  63     {
  64         var cell = document.createElement("div");
  65         cell.className = "cell";
  66         return cell;
  67     }
  68
  69     function insertCell(tableID, beforeID)
  70     {
  71         var table = document.getElementById(tableID);
  72         var before = document.getElementById(beforeID);
  73         table.insertBefore(createCell(), before);
  74     }
  75
  76     function createRow()
  77     {
  78         var row = document.createElement("div");
  79         row.className = "row";
  80         return row;
  81     }
  82
  83     function insertRow(tableID, beforeID)
  84     {
  85         var table = document.getElementById(tableID);
  86         var before = document.getElementById(beforeID);
  87         table.insertBefore(createRow(), before);
  88     }
  89
  90     function createBlock()
  91     {
  92         var block = document.createElement("div");
  93         block.className = "block";
  94         return block;
  95     }
  96
  97     function insertBlock(tableID, beforeID)
  98     {
  99         var table = document.getElementById(tableID);
 100         var before = document.getElementById(beforeID);
 101         table.insertBefore(createBlock(), before);
 102     }
 103
 104     document.body.offsetTop;
 105
 106     insertCell("table-1", "tbody-1");
 107     insertCell("table-2", "row");
 108     insertCell("table-3", "caption");
 109     insertCell("table-4", "colgroup");
 110     insertRow("table-5", "tbody-5");
 111     insertCell("table-6", "col-6");
 112     insertCell("table-7", "block");
 113     insertBlock("table-8", "cell");
 114 </script>
 115 </body>
 116 </html>