third_party/WebKit/LayoutTests/fast/layout/common-ancestor-relayout-boundary.html

   1 <!DOCTYPE html>
   2 <script src="../../resources/js-test.js"></script>
   3 <style>
   4 /* Make all divs relayout boundaries. */
   5 div {
   6     width: 100px;
   7     height: 100px;
   8     overflow: hidden;
   9 }
  10 </style>
  11 <div id="relayout-common-ancestor"><div><div></div></div><div><div></div></div></div>
  12 <script>
  13 function dirtyLayout()
  14 {
  15     var container = document.getElementById('relayout-common-ancestor');
  16     for (var i = 0; i < container.childNodes.length; ++i) {
  17         var child = container.childNodes[i].firstChild;
  18         child.style.width = "99px";
  19         // Force a style recalc that doesn't force a layout so that the
  20         // needsLayout count is incremented.
  21         getComputedStyle(child).color;
  22     }
  23 }
  24
  25 document.documentElement.offsetTop;
  26
  27 // Pass quiet=true here so that the added nodes from the shouldBe don't
  28 // mess up the needsLayoutCount on line 45.
  29 if (window.internals)
  30     shouldBe("window.internals.needsLayoutCount()", "0", true);
  31
  32 dirtyLayout();
  33
  34 // The tree appears as following, with the starred nodes dirty:
  35 //       div [relayout-common-ancestor]
  36 //      /   \
  37 //   *div  *div
  38 //    /      /
  39 // *div   *div
  40 if (window.internals)
  41     shouldBe("window.internals.needsLayoutCount()", "4");
  42
  43 document.documentElement.offsetTop;
  44
  45 if (window.internals)
  46     shouldBe("window.internals.needsLayoutCount()", "0");
  47 </script>