blob: b8166e4b1cdd97d000721bc309132cecf4e73946 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
|
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script>
customElements.define("custom-div", class extends HTMLDivElement {
constructor() {
super();
this.attachShadow({ mode: "open" });
let p = document.createElement("p");
p.append(document.createElement("slot"));
let span = document.createElement("span");
span.textContent = "This should not be green.";
this.shadowRoot.append(p, span);
}
}, {
extends: "div",
});
</script>
<style>
span { color: red; }
div.x > span { color: green; }
</style>
</head>
<body onload="document.body.offsetTop; document.querySelector('div').className = 'x'">
<div is="custom-div">
<span>This should be green.</span>
</div>
</body>
</html>
|
