src/third_party/WebKit/LayoutTests/fast/repaint/subtree-layoutstate-transform.html

   1 <html>
   2 <head>
   3   <style type="text/css" media="screen">
   4     .transformed {
   5       height: 100px;
   6       width: 100px;
   7       margin: 20px;
   8       transform: scale(2);
   9       -webkit-transform-origin: top left;
  10     }
  11
  12     .layoutroot {
  13       height: 100px;
  14       width: 100px;
  15       overflow: hidden;
  16       background-color: red;
  17     }
  18   </style>
  19     <script src="resources/text-based-repaint.js"></script>
  20     <script>
  21         function repaintTest()
  22         {
  23             document.getElementById("target").style.width = "100px";
  24         }
  25     </script>
  26 </head>
  27 <body onload="runRepaintTest()">
  28
  29   <p>Tests repaint after layout of a subtree, inside a transformed element. You should see a large green square below.</p>
  30   <div class="transformed">
  31     <div class="layoutroot">
  32       <div id="target" style="height: 100px; width: 50px; background-color: green;"></div>
  33     </div>
  34   </div>
  35
  36 </body>
  37 </html>