exposed-object-within-shadow.html | Explore in Territory

<!doctype html>
<html>
<head>
<script src="../../../resources/js-test.js"></script>
</head>
<body>
<object id="o1" name="obj1"><div></div></object>
<object id="o2" name="obj2"><param name="n"><div></div></param></object>
<script>
var obj;
var host;
var shadowRoot;
var child;

function testAncestorObjectDivShadow() {
    debug("Shadow DOM inside an &lt;object&gt; and a &lt;div&gt;");
    obj = document.getElementById("o1");
    host = obj.querySelector("div");
    shadowRoot = host.attachShadow({mode: 'open'});

    child = document.createElement("object");
    child.name = "obj1-child1";
    shadowRoot.appendChild(child);

    // Inner <object> not visible for two reasons:
    // <object> ancestor + shadow root in-between.
    shouldBeFalse("child.name in document");
    shouldBeFalse("child.name in window");

    // Should be able to see 'obj'..even with a descendant <object>, but hidden by shadow.
    shouldBeTrue("obj.name in document");
}

function testSiblingObjectShadow() {
    debug("Shadow DOM attached to &lt;div&gt; with an &lt;object&gt; sibling (next).");
    var div = document.createElement("div");
    document.body.appendChild(div);
    var div2 = document.createElement("div");
    div.appendChild(div2);
    obj = document.createElement("object");
    obj.name = "obj3";
    div2.appendChild(obj);
    shadowRoot = div2.attachShadow({mode: 'open'});

    child = document.createElement("embed");
    child.name = "embed1";
    shadowRoot.appendChild(child);

    // <embed> not visible for two reasons:
    // <object> ancestor + shadow root in-between.
    shouldBeFalse("child.name in document");
    shouldBeFalse("child.name in window");

    // Should be able to see 'obj'..even though it has an <embed> descendant.
    shouldBeTrue("obj.name in document");
}

function testSiblingShadowObject() {
    debug("Shadow DOM attached to &lt;div&gt; with an &lt;object&gt; sibling (previous).");
    var div = document.createElement("div");
    document.body.appendChild(div);
    var div2 = document.createElement("div");
    div.appendChild(div2);
    obj = document.createElement("object");
    obj.name = "obj4";
    div2.appendChild(obj);
    shadowRoot = div2.attachShadow({mode: 'open'});

    child = document.createElement("embed");
    child.name = "embed1";
    shadowRoot.appendChild(child);

    // <embed> not visible for two reasons:
    // <object> ancestor + shadow root in-between.
    shouldBeFalse("child.name in document");
    shouldBeFalse("child.name in window");

    // Should be able to see 'obj'..even though it has an <embed> descendant.
    shouldBeTrue("obj.name in document");
}

function testAncestorObjectParamShadow() {
    debug("Shadow DOM attached to &lt;div&gt; inside a &lt;param&gt; inside an &lt;object&gt;.");
    obj = document.getElementById("o2");

    // Should be able to see 'obj' initially.
    shouldBeTrue("obj.name in document");

    host = obj.querySelector("div");
    shadowRoot = host.attachShadow({mode: 'open'});

    child = document.createElement("embed");
    child.name = "embed1";
    shadowRoot.appendChild(child);

    // <embed> not visible for two reasons:
    // <object> ancestor + shadow root in-between.
    shouldBeFalse("child.name in document");
    shouldBeFalse("child.name in window");

    // Should still be able to see 'obj'
    shouldBeTrue("obj.name in document");
}

testAncestorObjectDivShadow();
testSiblingObjectShadow();
testSiblingShadowObject();
testAncestorObjectParamShadow();
</script>
</body>
</html>
chromium/third_party/blink/web_tests/fast/dom/shadow/exposed-object-within-shadow.html
