third_party/WebKit/LayoutTests/fast/css/invalidation/targeted-class-id.html

   1 <!DOCTYPE html>
   2 <script src="../../../resources/js-test.js"></script>
   3 <style>
   4 .a1 #b1 { background-color: green }
   5 .a2 div + #b2 { background-color: green }
   6 </style>
   7 <div id="t1">
   8     <div></div>
   9     <div id="b1"></div>
  10 </div>
  11 <div id="t2">
  12     <div></div>
  13     <div id="b2"></div>
  14 </div>
  15 <script>
  16 description("Check that targeted class invalidation works for id selectors.");
  17
  18 var transparent = "rgba(0, 0, 0, 0)";
  19 var green = "rgb(0, 128, 0)";
  20
  21 var b1 = document.getElementById("b1");
  22 var b2 = document.getElementById("b2");
  23
  24 shouldBe("getComputedStyle(b1, null).backgroundColor", "transparent");
  25 shouldBe("getComputedStyle(b2, null).backgroundColor", "transparent");
  26
  27 document.body.offsetTop; // Force style recalc.
  28
  29 document.getElementById("t1").className = "a1";
  30 if (window.internals)
  31     shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1");
  32 shouldBe("getComputedStyle(b1, null).backgroundColor", "green");
  33
  34 document.body.offsetLeft; // force style recalc.
  35
  36 document.getElementById("t2").className = "a2";
  37 if (window.internals)
  38     shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1");
  39 shouldBe("getComputedStyle(b2, null).backgroundColor", "green");
  40
  41 </script>