src/third_party/WebKit/LayoutTests/fast/repaint/scroll-inside-table-cell.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <head>
   4     <link rel="stylesheet" href="resources/default.css" />
   5     <style>
   6         table {
   7             border-spacing: 0px;
   8             background: red;
   9         }
  10
  11         td {
  12             padding: 0px;
  13             border: 2px solid green;
  14         }
  15     </style>
  16     <script src="resources/repaint.js"></script>
  17     <script>
  18         if (window.testRunner)
  19             testRunner.dumpAsTextWithPixelResults();
  20
  21         function repaintTest()
  22         {
  23             var cell = document.getElementById("cellToScroll");
  24             cell.scrollLeft = 1200;
  25         }
  26         window.addEventListener("load", runRepaintTest, false);
  27     </script>
  28 </head>
  29 <body>
  30 <!-- Bug 71550 - REGRESSION (r93614): Content remains despite parent element being scrolled off page using javascript. -->
  31 <!-- For the test to pass you should not see any RED, only green -->
  32 <table style="table-layout: fixed; width: 0">
  33     <tr class="red">
  34         <td class="green" style="height: 100px; width: 300px;"></td>
  35         <td class="green" style="height: 100px; width: 450px;"></td>
  36     </tr>
  37     <tr>
  38         <td style="overflow: hidden"><div class="green" style="height: 465px; width: 300px"></div></td>
  39         <td id="cellToScroll" class="relative" style="overflow: scroll;">
  40             <div class="relative red" style="height: 450px; width: 450px;"></div>
  41             <div class="absolute green" style="height: 450px; width: 450px; left: 500px; top: 0px"></div>
  42         </td>
  43     </tr>
  44 </table>
  45 </body>
  46 </html>