not-apply-in-shadow-root-001.html (988B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Shadow DOM Test - Tests CSS rules must not apply in a shadow root</title> 5 <link rel="match" href="not-apply-in-shadow-root-001-ref.html"> 6 <link rel="author" title="Kazuhito Hokamura" href="mailto:k.hokamura@gmail.com"> 7 <link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#styles"> 8 <meta name="assert" content="Styles: CSS rules declared in an enclosing tree must not apply in a shadow tree if apply-author-styles flag is not set."> 9 <script src="../../../html/resources/common.js"></script> 10 <style> 11 div { 12 width: 100px; 13 height: 100px; 14 background: green; 15 } 16 </style> 17 </head> 18 <body> 19 <p>Test passes if following box is green.</p> 20 <div id="shadow-host"></div> 21 <script> 22 var shadowHost = document.getElementById('shadow-host'); 23 var shadowRoot = shadowHost.attachShadow({mode: 'open'}); 24 var style = document.createElement('style'); 25 style.innerHTML = 'div { background: red }'; 26 27 shadowRoot.appendChild(style); 28 </script> 29 </body> 30 </html>