blob: 0370fcf47a290df65bfdddb4c5859be3c4f5249a [file] [log] [blame]
<!DOCTYPE html>
<html>
<script src="resources/polyfill.js"></script>
<p>Fallback elements should be rendered if it's distributed</p>
<div id="host1"></div>
<script>
var shadowRoot1 = host1.webkitCreateShadowRoot();
shadowRoot1.innerHTML =
'<div id="host2">' +
'<content><div title="debugstop">content fallback element</div></content>' +
'<shadow><div>shadow fallback element</div></shadow>' +
'<div>This should be selected.</div>' +
'</div>';
var host2 = shadowRoot1.getElementById('host2');
var shadowRoot2 = host2.webkitCreateShadowRoot();
shadowRoot2.innerHTML =
'<div id="host3">' +
'<content select="div"></content>' +
'<content select="span"><div>content fallback element</div></content>' +
'<div>This also should be selected.</div>'
'</div>';
var host3 = shadowRoot2.getElementById('host3');
var shadowRoot3 = host3.webkitCreateShadowRoot();
shadowRoot3.innerHTML =
'<content select="div"></content>'
</script>
</html>