third_party/WebKit/LayoutTests/fast/css/invalidation/dynamic-selector-list-pseudo.html

   1 <!DOCTYPE html>
   2 <script src="../../../resources/js-test.js"></script>
   3 <style>
   4 .a1 .a2:-webkit-any(.a3, .a4) { background-color: green }
   5 .b1 .b2:not(.b3) { background-color: green }
   6 .c1 .c2:-webkit-any(:not(.c3)) { background-color: green }
   7 .d1:not(.d2) .d3 { background-color: green; }
   8 .e1 :not(.e2) { background-color: green; }
   9 </style>
  10 <div class="a1">
  11     <div class="a2" id="t1">Background should be green</div>
  12 </div>
  13 <div class="b1">
  14     <div class="b2 b3" id="t2">Background should be green</div>
  15 </div>
  16 <div class="c1">
  17     <div class="c2 c3" id="t3">Background should be green</div>
  18 </div>
  19 <div id="outer-d" class="d1 d2">
  20     <div id="t4" class="d3">Background should be green</div>
  21 </div>
  22 <div id="outer-e">
  23     <div id="t5">Background should be green</div>
  24 </div>
  25 <script>
  26 description("Change classes affecting :-webkit-any and :not.")
  27
  28 document.body.offsetTop; // force style recalc.
  29
  30 var transparent = 'rgba(0, 0, 0, 0)';
  31 var green = 'rgb(0, 128, 0)';
  32
  33 var t1 = document.getElementById("t1");
  34 shouldBe("getComputedStyle(t1, null).backgroundColor", "transparent");
  35 t1.className = "a2 a3";
  36 shouldBe("getComputedStyle(t1, null).backgroundColor", "green");
  37
  38 var t2 = document.getElementById("t2");
  39 shouldBe("getComputedStyle(t2, null).backgroundColor", "transparent");
  40 t2.className = "b2";
  41 shouldBe("getComputedStyle(t2, null).backgroundColor", "green");
  42
  43 var t3 = document.getElementById("t3");
  44 shouldBe("getComputedStyle(t3, null).backgroundColor", "transparent");
  45 t3.className = "c2";
  46 shouldBe("getComputedStyle(t3, null).backgroundColor", "green");
  47
  48 var t4 = document.getElementById("t4");
  49 shouldBe("getComputedStyle(t4, null).backgroundColor", "transparent");
  50 document.getElementById("outer-d").className = "d1";
  51 shouldBe("getComputedStyle(t4, null).backgroundColor", "green");
  52
  53 var t5 = document.getElementById("t5");
  54 shouldBe("getComputedStyle(t5, null).backgroundColor", "transparent");
  55 document.getElementById("outer-e").className = "e1";
  56 shouldBe("getComputedStyle(t5, null).backgroundColor", "green");
  57 </script>