OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../../../resources/js-test.js"></script> |
| 3 <style> |
| 4 .a + .b { color: green; } |
| 5 .c + .d { color: green; } |
| 6 .e { color: green; } |
| 7 </style> |
| 8 <div id="t1"> |
| 9 <div></div> |
| 10 <div class="b"></div> |
| 11 </div> |
| 12 <div id="t2"> |
| 13 <div> |
| 14 <div></div> |
| 15 <div class="d"></div> |
| 16 </div> |
| 17 <div> |
| 18 <div class="e"></div> |
| 19 </div> |
| 20 </div> |
| 21 <div id="t3"> |
| 22 <div> |
| 23 <div></div> |
| 24 <div class="d"></div> |
| 25 </div> |
| 26 <div> |
| 27 <div class="a"></div> |
| 28 <div class="b"></div> |
| 29 </div> |
| 30 </div> |
| 31 <script> |
| 32 description("Check that getComputedStyle causes a style recalc when necessary, a
nd only when necessary."); |
| 33 |
| 34 var green = "rgb(0, 128, 0)"; |
| 35 |
| 36 // Check that sibling recalc for .b is performed before computed style is return
ed. |
| 37 |
| 38 document.body.offsetTop; |
| 39 document.body.querySelector("#t1 > div").className = "a"; |
| 40 shouldBe("getComputedStyle(document.body.querySelector('#t1 .b')).color", "green
", true); |
| 41 if (window.internals) |
| 42 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "0"); |
| 43 |
| 44 // No style invalidation or recalc scheduled for an ascendant of .e, and no affe
cted-by-adjacent |
| 45 // bits set on any ascendants, hence we don't need to do a recalc even if a styl
e invalidation |
| 46 // is scheduled for the .c change with adjacent implications. |
| 47 |
| 48 document.body.offsetTop; |
| 49 document.body.querySelector("#t2 > div > div").className = "c"; |
| 50 shouldBe("getComputedStyle(document.body.querySelector('#t2 .e')).color", "green
", true); |
| 51 if (window.internals) |
| 52 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "2"); |
| 53 |
| 54 // No style invalidation or recalc scheduled for an ascendant of .b, and even if
affected-by-adjacent |
| 55 // bits are set on the ascendant (because of a+b), it doesn't matter since that
ascendant does |
| 56 // not have any children that needs style recalc or invalidation. |
| 57 |
| 58 document.body.offsetTop; |
| 59 document.body.querySelector("#t3 > div > div").className = "c"; |
| 60 shouldBe("getComputedStyle(document.body.querySelector('#t3 .b')).color", "green
", true); |
| 61 if (window.internals) |
| 62 shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "2"); |
| 63 |
| 64 </script> |
OLD | NEW |