LayoutTests/inspector/timeline/timeline-layout.html

   1 <html>
   2 <head>
   3 <script src="../../http/tests/inspector/inspector-test.js"></script>
   4 <script src="../../http/tests/inspector/timeline-test.js"></script>
   5 <style>
   6 .relayout-boundary {
   7     overflow: hidden;
   8     width: 100px;
   9     height: 100px;
  10 }
  11 </style>
  12 <script>
  13
  14 function invalidateAndForceLayout(element)
  15 {
  16     element.style.marginTop = "10px";
  17     var unused = element.offsetHeight;
  18 }
  19
  20 function performActions()
  21 {
  22     invalidateAndForceLayout(document.getElementById("invalidate1"));
  23     invalidateAndForceLayout(document.getElementById("invalidate2"));
  24 }
  25
  26 function test()
  27 {
  28     InspectorTest.evaluateInPage("testRunner.display()", function() {
  29         InspectorTest.performActionsAndPrint("performActions()", "Layout");
  30     });
  31 }
  32
  33 </script>
  34 </head>
  35
  36 <body onload="runTest()">
  37 <p>
  38 Tests the Timeline API instrumentation of a Layout event
  39 </p>
  40 <div class="relayout-boundary">
  41     <div>text</div>
  42     <div></div>
  43     <div>
  44         <div id="invalidate1"><div>text</div></div>
  45     </div>
  46 </div>
  47 <div class="relayout-boundary">
  48     <div></div>
  49     <div>text</div>
  50     <div id="invalidate2"><div>text</div></div>
  51     <div></div>
  52     <div></div>
  53     <div>text</div>
  54 </div>
  55
  56 </body>
  57 </html>