OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src="../../../resources/js-test.js"></script> | 2 <script src="../../../resources/js-test.js"></script> |
3 <style> | 3 <style> |
4 :-webkit-any(.a1) { background-color: green } | 4 :-webkit-any(.a1) { background-color: green } |
5 .a2 :-webkit-any(.b2) { background-color: green } | 5 .a2 :-webkit-any(.b2) { background-color: green } |
6 .a3 :-webkit-any(.b3, .c3) { background-color: green } | 6 .a3 :-webkit-any(.b3, .c3) { background-color: green } |
7 .a4 :-webkit-any(:not(.b4), .c4) { background-color: green } | 7 .a4 :-webkit-any(:not(.b4), .c4) { background-color: green } |
| 8 :-webkit-any(.a5, .b5) ~ .c5 .d5 { background-color: green } |
| 9 |
8 </style> | 10 </style> |
9 <div id="t1"> | 11 <div id="t1"> |
10 <span></span> | 12 <span></span> |
11 <span></span> | 13 <span></span> |
12 <span></span> | 14 <span></span> |
13 <span></span> | 15 <span></span> |
14 </div> | 16 </div> |
15 <div id="t2"> | 17 <div id="t2"> |
16 <span></span> | 18 <span></span> |
17 <span></span> | 19 <span></span> |
18 <span></span> | 20 <span></span> |
19 <span class="b2"></span> | 21 <span class="b2"></span> |
20 </div> | 22 </div> |
21 <div id="t3"> | 23 <div id="t3"> |
22 <span></span> | 24 <span></span> |
23 <span></span> | 25 <span></span> |
24 <span class="b3"></span> | 26 <span class="b3"></span> |
25 <span class="c3"></span> | 27 <span class="c3"></span> |
26 </div> | 28 </div> |
27 <div id="t4"> | 29 <div id="t4"> |
28 <span></span> | 30 <span></span> |
29 <span class="b4"></span> | 31 <span class="b4"></span> |
30 <span class="b4"></span> | 32 <span class="b4"></span> |
31 <span class="c4"></span> | 33 <span class="c4"></span> |
32 </div> | 34 </div> |
| 35 <div> |
| 36 <span id="t5"></span> |
| 37 <span class="c5"> |
| 38 <span class="d5"></span> |
| 39 </span> |
| 40 </div> |
33 <script> | 41 <script> |
34 description("Check that targeted class invalidation works with :-webkit-any sele
ctors."); | 42 description("Check that targeted class invalidation works with :-webkit-any sele
ctors."); |
35 | 43 |
36 var transparent = "rgba(0, 0, 0, 0)"; | 44 var transparent = "rgba(0, 0, 0, 0)"; |
37 var green = "rgb(0, 128, 0)"; | 45 var green = "rgb(0, 128, 0)"; |
38 | 46 |
39 var t1 = document.getElementById("t1"); | 47 var t1 = document.getElementById("t1"); |
40 var b2 = document.querySelector("#t2 .b2"); | 48 var b2 = document.querySelector("#t2 .b2"); |
41 var b3 = document.querySelector("#t3 .b3"); | 49 var b3 = document.querySelector("#t3 .b3"); |
42 var c3 = document.querySelector("#t3 .c3"); | 50 var c3 = document.querySelector("#t3 .c3"); |
43 var spans4 = document.querySelectorAll("#t4 span"); | 51 var spans4 = document.querySelectorAll("#t4 span"); |
| 52 var d5 = document.querySelector("#t5 ~ .c5 .d5"); |
44 | 53 |
45 shouldBe("getComputedStyle(t1, null).backgroundColor", "transparent"); | 54 shouldBe("getComputedStyle(t1, null).backgroundColor", "transparent"); |
46 shouldBe("getComputedStyle(b2, null).backgroundColor", "transparent"); | 55 shouldBe("getComputedStyle(b2, null).backgroundColor", "transparent"); |
47 shouldBe("getComputedStyle(b3, null).backgroundColor", "transparent"); | 56 shouldBe("getComputedStyle(b3, null).backgroundColor", "transparent"); |
48 shouldBe("getComputedStyle(c3, null).backgroundColor", "transparent"); | 57 shouldBe("getComputedStyle(c3, null).backgroundColor", "transparent"); |
49 | 58 |
50 for (var i=0; i<4; i++) | 59 for (var i=0; i<4; i++) |
51 shouldBe("getComputedStyle(spans4[i], null).backgroundColor", "transparent")
; | 60 shouldBe("getComputedStyle(spans4[i], null).backgroundColor", "transparent")
; |
52 | 61 |
| 62 shouldBe("getComputedStyle(d5, null).backgroundColor", "transparent"); |
| 63 |
53 document.body.offsetLeft; // force style recalc. | 64 document.body.offsetLeft; // force style recalc. |
54 | 65 |
55 t1.className = "a1"; | 66 t1.className = "a1"; |
56 if (window.internals) | 67 if (window.internals) |
57 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1"); | 68 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1"); |
58 shouldBe("getComputedStyle(t1, null).backgroundColor", "green"); | 69 shouldBe("getComputedStyle(t1, null).backgroundColor", "green"); |
59 | 70 |
60 document.body.offsetLeft; // force style recalc. | 71 document.body.offsetLeft; // force style recalc. |
61 | 72 |
62 document.getElementById("t2").className = "a2"; | 73 document.getElementById("t2").className = "a2"; |
(...skipping 11 matching lines...) Expand all Loading... |
74 | 85 |
75 document.body.offsetLeft; // force style recalc. | 86 document.body.offsetLeft; // force style recalc. |
76 | 87 |
77 document.getElementById("t4").className = "a4"; | 88 document.getElementById("t4").className = "a4"; |
78 if (window.internals) | 89 if (window.internals) |
79 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "5"); | 90 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "5"); |
80 shouldBe("getComputedStyle(spans4[0], null).backgroundColor", "green"); | 91 shouldBe("getComputedStyle(spans4[0], null).backgroundColor", "green"); |
81 shouldBe("getComputedStyle(spans4[1], null).backgroundColor", "transparent"); | 92 shouldBe("getComputedStyle(spans4[1], null).backgroundColor", "transparent"); |
82 shouldBe("getComputedStyle(spans4[2], null).backgroundColor", "transparent"); | 93 shouldBe("getComputedStyle(spans4[2], null).backgroundColor", "transparent"); |
83 shouldBe("getComputedStyle(spans4[3], null).backgroundColor", "green"); | 94 shouldBe("getComputedStyle(spans4[3], null).backgroundColor", "green"); |
| 95 |
| 96 document.body.offsetLeft; // force style recalc. |
| 97 |
| 98 document.getElementById("t5").className = "a5"; |
| 99 if (window.internals) |
| 100 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1"); |
| 101 shouldBe("getComputedStyle(d5, null).backgroundColor", "green"); |
84 </script> | 102 </script> |
OLD | NEW |