nested_tree_reftest.html (1195B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8" > 5 <title>Shadow DOM Test - Tests nested shadow tree.</title> 6 <link rel="match" href="nested_tree_reftest-ref.html" > 7 <link rel="author" title="shingo.miyazawa" href="mailto:kumatronik@gmail.com" > 8 <link rel="help" href="https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#nested-shadow-trees" > 9 <script src="../../../../html/resources/common.js"></script> 10 <meta name="assert" content="nested shadow tree style is valid." > 11 <style> 12 #host { 13 width: 100px; 14 height: 100px; 15 background-color: red; 16 } 17 </style> 18 </head> 19 <body> 20 <p>The test passes if there is a green square. Test failed if there is a red square.</p> 21 <div id='host'> 22 </div> 23 <script> 24 var shadowRoot = document.getElementById('host').attachShadow({mode: 'open'}); 25 shadowRoot.innerHTML = '<div id="sub" style="width: 100%;height:100%;"></div>'; 26 var nestedRoot = shadowRoot.getElementById('sub').attachShadow({mode: 'open'}); 27 nestedRoot.innerHTML = '<div style="width:100%; height:100%;background-color: green;"></div>'; 28 </script> 29 </body> 30 </html>