src/third_party/WebKit/LayoutTests/fast/repaint/transform-repaint-descendants.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
   2 <html>
   3 <head>
   4   <title>Transform Repaint Descendants</title>
   5   <meta http-equiv="content-type" content="text/html; charset=utf-8">
   6   <style type="text/css">
   7     #box {
   8       position:relative;
   9       top: 100px;
  10       left: 100px;
  11       height: 200px;
  12       width: 200px;
  13       background-color: #CCC;
  14       border: 1px solid black;
  15     }
  16
  17     #box > div {
  18       position: absolute;
  19       height: 50px;
  20       width: 400px;
  21       top: 75px;
  22       left: 75px;
  23       background-color: #555;
  24     }
  25   </style>
  26   <script src="resources/repaint.js" type="text/javascript" charset="utf-8"></script>
  27   <script type="text/javascript" charset="utf-8">
  28     if (window.testRunner)
  29       testRunner.waitUntilDone();
  30
  31     var gAngle = 20;
  32     function incrementAngle()
  33     {
  34       document.getElementById('box').style.webkitTransform = 'rotate(' + gAngle + 'deg)';
  35       gAngle += 3;
  36     }
  37
  38     function repaintTest()
  39     {
  40       incrementAngle();
  41     }
  42
  43     function startTest()
  44     {
  45       incrementAngle();
  46       window.setTimeout(function() {
  47         runRepaintTest();
  48         if (window.testRunner)
  49           testRunner.notifyDone();
  50       }, 0);
  51     }
  52   </script>
  53 </head>
  54 <body onload="startTest()">
  55   <p>Test for <a href="https://bugs.webkit.org/show_bug.cgi?id=22088">https://bugs.webkit.org/show_bug.cgi?id=22088</a>. The rotated box should be correctly redrawn.</p>
  56   <div id="box"><div></div></div>
  57 </body>
  58 </html>