35 lines
1.2 KiB
HTML
35 lines
1.2 KiB
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<script type="application/x-javascript">
|
|
customElements.define("custom-element", class extends HTMLElement {
|
|
constructor() {
|
|
super();
|
|
const template = document.getElementById("template");
|
|
const shadowRoot = this.attachShadow({mode: "open"})
|
|
.appendChild(template.content.cloneNode(true));
|
|
}
|
|
});
|
|
function runTest() {
|
|
var div = document.getElementById("testDiv");
|
|
|
|
// First we have to make sure that we've looked up the primary frame for
|
|
// the previous child span. Appending text to it should do the trick.
|
|
div.firstChild.
|
|
appendChild(document.createTextNode("This is text in a div "));
|
|
|
|
// Now flush out reflow
|
|
document.body.offsetWidth;
|
|
|
|
var node = document.createElementNS("http://www.w3.org/1999/xhtml",
|
|
"span");
|
|
div.appendChild(node);
|
|
node.appendChild(document.createTextNode("This text should appear"));
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body onload="runTest()">
|
|
<template id="binding"><span><slot/></span></template>
|
|
<custom-element id="testDiv" style="width: 0; display: block;"><span></span></custom-element>
|
|
</body>
|
|
</html>
|