| <!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> |
| |
| |