third_party/WebKit/LayoutTests/paint/invalidation/spv2/transform-absolute-child.html

   1 <!-- Based on fast/repaint/transform-absolute-child.html -->
   2 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   3    "http://www.w3.org/TR/html4/loose.dtd">
   4 <html lang="en">
   5 <head>
   6   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   7   <title>Transform with Abs. Pos child</title>
   8   <style type="text/css" media="screen">
   9      #box {
  10         position: relative;
  11         margin: 50px;
  12         width: 200px;
  13         height: 200px;
  14         border: 2px solid black;
  15         transform: rotate(0deg);
  16      }
  17      #box.rotated {
  18         transform: rotate(40deg);
  19      }
  20      #child {
  21         position: absolute;
  22         width: 400px;
  23         height: 50px;
  24         top: 75px;
  25         left: 75px;
  26         background-color: gray;
  27      }
  28   </style>
  29   <script src="resources/paint-invalidation-test.js" type="text/javascript" charset="utf-8"></script>
  30   <script type="text/javascript" charset="utf-8">
  31     window.expectedPaintInvalidationObjects = [
  32         "LayoutBlockFlow (relative positioned) DIV id='box' class='rotated'",
  33         "LayoutBlockFlow (positioned) DIV id='child'",
  34     ];
  35     function paintInvalidationTest()
  36     {
  37       document.getElementById('box').className = 'rotated';
  38     }
  39   </script>
  40 </head>
  41 <body onload="runPaintInvalidationTest()">
  42 <div id="box">
  43     <div id="child">
  44     </div>
  45 </div>
  46 </body>
  47 </html>