| <!DOCTYPE html> |
| <script src="../resources/js-test.js"></script> |
| <div id="host"> |
| <div slot="s1">This text should be green</div> |
| </div> |
| <script> |
| description("A changed inherited property on a slot parent should propagate down to slotted elements."); |
| |
| var root = host.attachShadow({mode:"open"}); |
| root.innerHTML = '<style>.p1 { color: green }</style><div id="p1"><slot name="s1"></slot></div>'; |
| var p1 = root.querySelector("#p1"); |
| var s1 = host.querySelector("[slot]"); |
| shouldBeEqualToString("getComputedStyle(s1).color", "rgb(0, 0, 0)"); |
| p1.className = "p1"; |
| shouldBeEqualToString("getComputedStyle(s1).color", "rgb(0, 128, 0)"); |
| </script> |