layout/style/test/test_invalidation_basic.html

   1 <!doctype html>
   2 <meta charset="utf-8">
   3 <title>
   4   Test for bug 1368240: We only invalidate style as little as needed
   5 </title>
   6 <link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez">
   7 <script src="/tests/SimpleTest/SimpleTest.js"></script>
   8 <style>
   9 .foo .bar {
  10   color: red;
  11 }
  12 #container ~ .bar {
  13   color: green;
  14 }
  15 </style>
  16 <div id="container">
  17   <div></div>
  18   <div></div>
  19   <div></div>
  20 </div>
  21 <div></div>
  22 <div></div>
  23 <script>
  24 SimpleTest.waitForExplicitFinish();
  25 const utils = SpecialPowers.getDOMWindowUtils(window);
  26
  27 // TODO(emilio): Add an API to get the ComputedStyles we've recreated, to make
  28 // more elaborated tests.
  29 document.documentElement.offsetTop;
  30 const initialRestyleGeneration = utils.restyleGeneration;
  31
  32 // Normally we'd restyle the whole subtree in this case, but we should go down
  33 // the tree invalidating as little as needed (nothing in this case).
  34 container.classList.add("foo");
  35 document.documentElement.offsetTop;
  36 is(utils.restyleGeneration, initialRestyleGeneration,
  37    "Shouldn't have restyled any descendant");
  38
  39 container.setAttribute("id", "");
  40 document.documentElement.offsetTop;
  41 is(utils.restyleGeneration, initialRestyleGeneration,
  42    "Shouldn't have restyled any sibling");
  43
  44 SimpleTest.finish();
  45 </script>