third_party/WebKit/LayoutTests/paint/invalidation/spv2/table-section-repaint.html

   1 <!-- Based on fast/repaint/table-section-repaint.html -->
   2 <html>
   3 <head>
   4     <title>Test for http://bugs.webkit.org/show_bug.cgi?id=12079</title>
   5     <style type="text/css">
   6         div.playground { position: relative; width: 90px; height: 90px; }
   7         .red { background-color: yellow; }
   8         .blue { background-color: blue; }
   9         .green { background-color: green; }
  10         .zero { height: 0; width: 60px; }
  11         .half { height: 30px; width: 60px; }
  12         .full { height: 60px; width: 60px; }
  13     </style>
  14     <script src="resources/paint-invalidation-test.js" type="text/javascript"></script>
  15     <script type="text/javascript">
  16         window.expectedPaintInvalidationObjects = [
  17             "LayoutBlockFlow CAPTION id='caption1' class='blue half'",
  18             "LayoutTableSection TBODY",
  19             "LayoutTableRow TR",
  20             "LayoutTableCell TD class='red half'",
  21             "LayoutTableRow TR",
  22             "LayoutTableCell TD class='green half'",
  23             "LayoutTableCell TD",
  24             "LayoutBlockFlow DIV id='top' class='blue half'",
  25             "LayoutTableSection TBODY",
  26             "LayoutTableRow TR",
  27             "LayoutTableCell TD class='red half'",
  28             "LayoutTableRow TR",
  29             "LayoutTableCell TD class='green half'",
  30             "LayoutBlockFlow CAPTION id='caption2' class='zero'",
  31             "LayoutTableSection TBODY",
  32             "LayoutTableRow TR",
  33             "LayoutTableCell TD class='green half'",
  34             "LayoutTableRow TR",
  35             "LayoutTableCell TD class='red half'",
  36             "LayoutTable TABLE",
  37             "LayoutBlockFlow DIV id='innerDiv'",
  38             "LayoutTableSection TBODY",
  39             "LayoutTableRow TR",
  40             "LayoutTableCell TD class='half'",
  41             "LayoutTableRow TR",
  42             "LayoutTableCell TD class='half'",
  43         ];
  44         function paintInvalidationTest()
  45         {
  46             var caption1 = document.getElementById("caption1");
  47             caption1.style.height = "0";
  48
  49             var caption2 = document.getElementById("caption2");
  50             caption2.style.height = "30px";
  51
  52             var top = document.getElementById("top");
  53             top.style.height = "0";
  54
  55             var top = document.getElementById("innerDiv");
  56             innerDiv.style.height = "15px";
  57         }
  58     </script>
  59 </head>
  60 <body onload="runPaintInvalidationTest()">
  61     <div class="playground">
  62         <table cellpadding="0" cellspacing="0">
  63             <caption id="caption1" class="blue half"></caption>
  64             <tbody>
  65                 <tr>
  66                     <td class="red half"></td>
  67                 </tr>
  68                 <tr>
  69                     <td class="green half"></td>
  70                 </tr>
  71             </tbody>
  72         </table>
  73     </div>
  74
  75     <div class="playground">
  76         <table cellpadding="0" cellspacing="0">
  77             <tbody>
  78                 <tr>
  79                     <td><div id="top" class="blue half"></div></td>
  80                 </tr>
  81             </tbody>
  82             <tbody>
  83                 <tr>
  84                     <td class="red half"></td>
  85                 </tr>
  86                 <tr>
  87                     <td class="green half"></td>
  88                 </tr>
  89             </tbody>
  90         </table>
  91     </div>
  92
  93     <div class="playground">
  94         <table cellpadding="0" cellspacing="0">
  95             <caption id="caption2" class="zero"></caption>
  96             <tbody>
  97                 <tr>
  98                     <td class="green half"></td>
  99                 </tr>
 100                 <tr>
 101                     <td class="red half"></td>
 102                 </tr>
 103             </tbody>
 104         </table>
 105     </div>
 106
 107     <div class="playground" style="margin-top: 30px;">
 108         <table cellpaddin="0" cellspacing="0" style="width: 60px; border-collapse: collapse; border: 8px solid green;">
 109             <caption style="width: 10px; margin: auto;">
 110                 <div id="innerDiv"></div>
 111             </caption>
 112             <tbody>
 113                 <tr><td class="half"></td></tr>
 114                 <tr><td class="half" style="border-top: solid yellow 8px;"></td></tr>
 115             </tbody>
 116         </table>
 117     </div>
 118 </body>
 119 </html>