test-008.html (1578B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>Shadow DOM Test: A_06_00_09</title> 5 <link rel="author" title="Sergey G. Grekhov" href="mailto:sgrekhov@unipro.ru"> 6 <link rel="help" href="http://www.w3.org/TR/2013/WD-shadow-dom-20130514/#styles"> 7 <meta name="assert" content="Styles:the styles of the shadow host are inherited by the children of the shadow root"> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 <script src="../../../html/resources/common.js"></script> 11 <script src="../../resources/shadow-dom-utils.js"></script> 12 </head> 13 <body> 14 <div id="log"></div> 15 <script> 16 test(unit(function (ctx) { 17 var d = newRenderedHTMLDocument(ctx); 18 19 d.body.innerHTML = '' + 20 '<div id="shHost" style="font-size:10px">' + 21 '<span id="spn1">This is a shadow host child</span>' + 22 '</div>'; 23 24 var host = d.querySelector('#shHost'); 25 26 var s = host.attachShadow({mode: 'open'}); 27 28 var div = d.createElement('div'); 29 div.innerHTML ='<span id="spn2">This is a shadow root child</span>'; 30 s.appendChild(div); 31 32 assert_equals(d.querySelector('#spn1').offsetTop, 0, 33 'Element should not be rendered'); 34 assert_true(s.querySelector('#spn2').offsetTop > 0, 35 'Element should be rendered'); 36 37 var oldHeight = s.querySelector('#spn2').offsetHeight; 38 39 host.setAttribute('style', 'font-size:20px'); 40 41 assert_true(s.querySelector('#spn2').offsetHeight > oldHeight, 42 'Shadow host style must be aplied to the shadow root children'); 43 44 }), 'A_06_00_09_T01'); 45 </script> 46 </body> 47 </html>