<!DOCTYPE html>

<html>

<p>ShadowRoot for InsertionPoint should not be rendered if the InsertionPoint is active, while it should be rendered if not active.</p>

<div id="host">
    <div>host children</div>
</div>

<script>
var shadowRoot = host.webkitCreateShadowRoot();
shadowRoot.innerHTML =
    '<div>' + 
        '<content id="active-content" select="div"><div>fallback</div></content>' +
        '<content select="span"><content id="inactive-content"></content></content>' +
    '</div>';

var activeContent = shadowRoot.getElementById('active-content');
var shadowRootForActiveContent = activeContent.webkitCreateShadowRoot();
shadowRootForActiveContent.innerHTML = '<div>For active content</div>';

var inactiveContent = shadowRoot.getElementById('inactive-content');
var shadowRootForInactiveContent = inactiveContent.webkitCreateShadowRoot();
shadowRootForInactiveContent.innerHTML = '<div>For Inactive content</div>';
</script>

</html>