| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../js/resources/js-test-pre.js"></script> |
| <script src="../../dom/shadow/resources/polyfill.js"></script> |
| </head> |
| <body> |
| <div id="test"></div> |
| |
| <script> |
| var div = document.createElement("div"); |
| document.body.appendChild(div); |
| |
| debug("Creating shadow dom subtrees from top to bottom."); |
| var shadow1 = div.webkitCreateShadowRoot(); |
| shadow1.innerHTML = "<div id='E'>/div>"; |
| var e = shadow1.getElementById("E"); |
| var shadow2 = e.webkitCreateShadowRoot(); |
| shadow2.innerHTML = "<div id='F'></div>"; |
| var f = shadow2.getElementById("F"); |
| var shadow3 = f.webkitCreateShadowRoot(); |
| shadow3.innerHTML = "<div id='G'></div>"; |
| |
| shouldBe("internals.parentTreeScope(shadow1)", "document"); |
| shouldBe("internals.parentTreeScope(shadow2)", "shadow1"); |
| shouldBe("internals.parentTreeScope(shadow3)", "shadow2"); |
| |
| document.body.removeChild(div); |
| |
| debug("Creating multiple shadow dom subtrees."); |
| div = document.createElement("div"); |
| document.body.appendChild(div); |
| shadow1 = div.webkitCreateShadowRoot(); |
| shadow1.innerHTML = "<div id='H'></div>"; |
| |
| var h = shadow1.getElementById("H"); |
| shadow2 = h.webkitCreateShadowRoot(); |
| shadow2.innerHTML = "<div>shadow2</div>"; |
| shadow3 = h.webkitCreateShadowRoot(); |
| shadow3.innerHTML = "<div>shadow3</div>"; |
| shouldBe("internals.parentTreeScope(shadow2)", "shadow1"); |
| shouldBe("internals.parentTreeScope(shadow3)", "shadow1"); |
| |
| document.body.removeChild(div); |
| |
| debug("Creating multiple shadow dom subtrees from bottom to top."); |
| f = document.createElement("div"); |
| shadow3 = f.webkitCreateShadowRoot(); |
| shadow3.innerHTML = "<div id='G'></div>"; |
| e = document.createElement("div"); |
| shadow2 = e.webkitCreateShadowRoot(); |
| shadow2.appendChild(f); |
| div = document.createElement("div"); |
| shadow1 = div.webkitCreateShadowRoot(); |
| shadow1.appendChild(e); |
| document.body.appendChild(div); |
| |
| shouldBe("internals.parentTreeScope(shadow1)", "document"); |
| shouldBe("internals.parentTreeScope(shadow2)", "shadow1"); |
| shouldBe("internals.parentTreeScope(shadow3)", "shadow2"); |
| |
| document.body.removeChild(div); |
| </script> |
| <script src="../../js/resources/js-test-post.js"></script> |
| </body> |
| </html> |
