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 .d1, .d2 { color: red } | 4 custom-element { color: red } |
5 </style> | 5 </style> |
6 <custom-element> | 6 <custom-element> |
7 <div class="d1">A</div> | 7 <div class="d1">A</div> |
8 <div class="d2">B</div> | 8 <div class="d2">B</div> |
9 </custom-element> | 9 </custom-element> |
10 <script> | 10 <script> |
11 description("Check that getComputedStyle causes a shadow re-distribution when ne
cessary."); | 11 description("Check that getComputedStyle causes a shadow re-distribution when ne
cessary."); |
12 | 12 |
13 var red = "rgb(255, 0, 0)"; | 13 var red = "rgb(255, 0, 0)"; |
14 var green = "rgb(0, 128, 0)"; | 14 var green = "rgb(0, 128, 0)"; |
15 | 15 |
16 var custom = document.querySelector("custom-element"); | 16 var custom = document.querySelector("custom-element"); |
17 var shadowRoot = custom.createShadowRoot(); | 17 var shadowRoot = custom.createShadowRoot(); |
18 shadowRoot.innerHTML = '<style>::content div { color: green; }</style><content s
elect=".d2"><content>' | 18 shadowRoot.innerHTML = '<style>::content div { color: green; }</style><content s
elect=".d2"><content>' |
19 | 19 |
20 var d1 = document.querySelector(".d1"); | 20 var d1 = document.querySelector(".d1"); |
21 var d2 = document.querySelector(".d2"); | 21 var d2 = document.querySelector(".d2"); |
22 | 22 |
23 shouldBe("getComputedStyle(d1).color", "red"); | 23 shouldBe("getComputedStyle(d1).color", "red"); |
24 shouldBe("getComputedStyle(d2).color", "green"); | 24 shouldBe("getComputedStyle(d2).color", "green"); |
25 | 25 |
26 document.body.offsetTop; | 26 document.body.offsetTop; |
27 | 27 |
28 shadowRoot.querySelector("content").setAttribute("select", ".d1"); | 28 shadowRoot.querySelector("content").setAttribute("select", ".d1"); |
29 | 29 |
30 shouldBe("getComputedStyle(d1).color", "green"); | 30 shouldBe("getComputedStyle(d1).color", "green"); |
31 shouldBe("getComputedStyle(d2).color", "red"); | 31 shouldBe("getComputedStyle(d2).color", "red"); |
32 | 32 |
33 </script> | 33 </script> |
OLD | NEW |