reprojection-001.html (1145B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>Shadow DOM Test - Tests a reprojection.</title> 6 <link rel="match" href="reprojection-001-ref.html"> 7 <link rel="author" title="Anna Ogawa" href="mailto:anna.ogawa.0219@gmail.com"> 8 <link rel="author" title="Hayato Ito" href="mailto:hayato@google.com"> 9 <link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#reprojection"> 10 <meta name="assert" content="a node is distributed into more than one insertion point."> 11 <script src="../../../../html/resources/common.js"></script> 12 <style> 13 .pass { color: green; } 14 </style> 15 </head> 16 <body> 17 <p>You should see green text saying "Apple" and "Orange" below.</p> 18 <div id="host"> 19 <div class="pass">Apple.</div> 20 <div class="pass">Orange.</div> 21 </div> 22 <script> 23 var shadowRoot = host.attachShadow({mode: 'open'}); 24 shadowRoot.innerHTML = '<div id="host2">Hello a Shadow Root.<slot></slot><div>Banana.</div></div>'; 25 var host2 = shadowRoot.getElementById("host2"); 26 var shadowRoot2 = host2.attachShadow({mode: 'open'}); 27 shadowRoot2.innerHTML = '<div>Hello a Shadow Root2.</div><div><slot></slot></div>'; 28 </script> 29 </body> 30 </html>