751a3800e76c3df199bc21920b3e07b6f9aea506
[WebKit-https.git] / LayoutTests / fast / shadow-dom / composed-tree-shadow-subtree.html
1 <html>
2 <script>
3 if (window.testRunner)
4     testRunner.dumpAsText();
5 </script>
6
7 <template id=shadow1></template>
8 <template id=shadow2><slot><div></div></slot></template>
9
10 <template test=1><div shadow=shadow1></div></template>
11 <template test=2><div shadow=shadow1>text</div></template>
12 <template test=3><div shadow=shadow2></div></template>
13 <template test=4><div shadow=shadow2>text</div></template>
14
15 <body>
16 <pre id=console></pre>
17 <script>
18 function installShadows(tree)
19 {
20     var shadowHosts = tree.querySelectorAll("[shadow]");
21     for (var i = 0; i < shadowHosts.length; ++i) {
22         var shadowId = shadowHosts[i].getAttribute("shadow");
23         var shadowContents = document.querySelector("#"+shadowId).content.cloneNode(true);
24
25         installShadows(shadowContents);
26
27         var shadowRoot = shadowHosts[i].attachShadow({ mode: "open" });
28         shadowRoot.appendChild(shadowContents);
29     }
30 }
31
32 var console = document.querySelector("#console");
33
34 var tests = document.querySelectorAll("[test]");
35 for (var i = 0; i < tests.length; ++i) {
36     var test = tests[i].content.cloneNode(true);
37     installShadows(test);
38     console.innerText += "\nTest " + tests[i].getAttribute("test") + "\n";
39     console.innerText += internals.composedTreeAsText(test);
40
41     console.innerText += "\nShadow host subtree\n"
42     var shadowSubtree = test.querySelector("[shadow]");
43     console.innerText += internals.composedTreeAsText(shadowSubtree);
44
45     var slotSubtree = shadowSubtree.shadowRoot.querySelector("slot");
46     if (slotSubtree) {
47         console.innerText += "\nSlot subtree\n"
48         console.innerText += internals.composedTreeAsText(slotSubtree);
49     }
50 }
51
52 </script>
53 </body>