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