| <!DOCTYPE html> |
| <script src="../../../resources/js-test.js"></script> |
| <style> |
| .select::selection { |
| background-color: red; |
| } |
| |
| .t1 .select::selection, |
| .t2 .select::selection:window-inactive { |
| background-color: green; |
| } |
| </style> |
| <div id="t1"> |
| <div> |
| <div class="select"> |
| 1 |
| <span></span> |
| <span></span> |
| </div> |
| <div></div> |
| </div> |
| </div> |
| <div id="t2"> |
| <div> |
| <div class="select"> |
| 2 |
| <span></span> |
| <span></span> |
| </div> |
| <div></div> |
| </div> |
| </div> |
| <script> |
| description("Style invalidation for ::selection"); |
| |
| var red = "rgb(255, 0, 0)"; |
| var green = "rgb(0, 128, 0)"; |
| |
| function setSelection(textNode) { |
| var range = document.createRange(); |
| range.setStart(textNode, 0); |
| range.setEnd(textNode, 1); |
| window.getSelection().addRange(range); |
| } |
| |
| var select = document.querySelectorAll(".select"); |
| |
| setSelection(select[0].firstChild); |
| shouldBe("getComputedStyle(select[0], '::selection').backgroundColor", "red"); |
| |
| document.body.offsetTop; // Force recalc. |
| t1.className = "t1"; |
| if (window.internals) |
| shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1"); |
| shouldBe("getComputedStyle(select[0], '::selection').backgroundColor", "green"); |
| |
| shouldBeDefined(window.testRunner); |
| testRunner.setWindowIsKey(false); |
| |
| setSelection(select[1].firstChild); |
| shouldBe("getComputedStyle(select[1], '::selection').backgroundColor", "red"); |
| |
| document.body.offsetTop; // Force recalc. |
| t2.className = "t2"; |
| if (window.internals) |
| shouldBe("internals.updateStyleAndReturnAffectedElementCount()", "1"); |
| shouldBe("getComputedStyle(select[1], '::selection').backgroundColor", "green"); |
| </script> |
