CSSStyleSheet-constructable-concat.html (1341B)
1 <!DOCTYPE html> 2 <html class="reftest-wait"> 3 <meta charset="utf-8"> 4 <title>Adoptedstylesheets.concat should work when starting empty</title> 5 <link rel="author" href="mailto:masonf@chromium.org"> 6 <link rel="help" href="https://drafts.csswg.org/cssom/#extensions-to-the-document-or-shadow-root-interface"> 7 <link rel="match" href="CSSStyleSheet-constructable-concat-ref.html"> 8 9 <span>This should be green</span> 10 <div id=host></div> 11 <pre id=tests>Tests: 12 </pre> 13 14 <script> 15 function assert_equals(val1,val2) { 16 const t = val1 === val2 ? 'PASS' : `FAIL! ${val1} !== ${val2}`; 17 tests.appendChild(document.createTextNode(`${t}\n`)); 18 } 19 window.onload = () => { 20 const sheet = new CSSStyleSheet(); 21 sheet.replaceSync('span {background-color:green;}'); 22 assert_equals(document.adoptedStyleSheets.length,0); 23 document.adoptedStyleSheets = document.adoptedStyleSheets.concat([sheet]); 24 assert_equals(document.adoptedStyleSheets.length,1); 25 26 const host = document.getElementById('host'); 27 const shadow = host.attachShadow({mode: 'open'}); 28 shadow.innerHTML = '<span>This should be green</span>'; 29 assert_equals(shadow.adoptedStyleSheets.length,0); 30 shadow.adoptedStyleSheets = shadow.adoptedStyleSheets.concat([sheet]); 31 assert_equals(shadow.adoptedStyleSheets.length,1); 32 document.documentElement.classList.remove("reftest-wait"); 33 }; 34 </script>