| <!DOCTYPE html> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <style> |
| #p1 :not(.t1), |
| #p2 :not(.t2) #r2, |
| #p3 :not(.t3) :not(.nomatch), |
| #p4 .t4 :not(.nomatch), |
| #p5 :-webkit-any(:not(.t5), #dummy) #r5, |
| #p6 .t6 #r6:not(.dummy), |
| #p7 + :not(.t7) + :not(.nomatch) #r7, |
| #p8 + .t8 ~ div :not(.nomatch) { background-color: rgb(0, 128, 0); } |
| </style> |
| <div id="p1"> |
| <div id="t1" class="t1"> |
| <div></div> |
| <div></div> |
| </div> |
| </div> |
| <div id="p2"> |
| <div id="t2" class="t2"> |
| <div></div> |
| <div id="r2"></div> |
| </div> |
| </div> |
| <div id="p3"> |
| <div id="t3" class="t3"> |
| <div></div> |
| <div id="r3"></div> |
| </div> |
| </div> |
| <div id="p4"> |
| <div id="t4"> |
| <div></div> |
| <div id="r4"></div> |
| </div> |
| </div> |
| <div id="p5"> |
| <div id="t5" class="t5"> |
| <div></div> |
| <div id="r5"></div> |
| </div> |
| </div> |
| <div id="p6"> |
| <div id="t6"> |
| <div></div> |
| <div id="r6"></div> |
| </div> |
| </div> |
| <div> |
| <div id="p7"></div> |
| <div id="t7" class="t7"></div> |
| <div> |
| <div></div> |
| <div id="r7"></div> |
| </div> |
| </div> |
| <div> |
| <div id="p8"></div> |
| <div id="t8"></div> |
| <div> |
| <div></div> |
| <div id="r8"></div> |
| </div> |
| <fieldset> |
| <div></div> |
| </fieldset> |
| </div> |
| |
| <script> |
| document.body.offsetTop; |
| |
| test(function() { |
| assert_true(!!window.internals, "This test only works with internals exposed present"); |
| }, "internals are exposed"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(t1).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t1.className = ""; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Single element style recalc"); |
| assert_equals(getComputedStyle(t1).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Negated class without combinators"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(r2).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t2.className = ""; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Recalc changed element and #r2"); |
| assert_equals(getComputedStyle(r2).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Id descendant of negated class"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(r3).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t3.className = ""; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3, "Subtree style recalc"); |
| assert_equals(getComputedStyle(r3).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Negated class descendant of negated class"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(r4).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t4.className = "t4"; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3, "Subtree style recalc"); |
| assert_equals(getComputedStyle(r4).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Negated class descendant of class"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(r5).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t5.className = ""; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Recalc changed element and #r5"); |
| assert_equals(getComputedStyle(r5).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Id descendant of negated class in :-webkit-any"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(r6).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t6.className = "t6"; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Recalc changed element and #r6"); |
| assert_equals(getComputedStyle(r6).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Negated class with id descendant of class"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(r7).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t7.className = ""; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Recalc changed element and #r7"); |
| assert_equals(getComputedStyle(r7).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Id descendant of negated sibling class"); |
| |
| test(function() { |
| assert_equals(getComputedStyle(r8).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent"); |
| |
| t8.className = "t8"; |
| assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3, "Subtree style recalc"); |
| assert_equals(getComputedStyle(r8).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change"); |
| }, "Negated class descendant of sibling class"); |
| |
| </script> |
