quirks-mode-stylesheet-dynamic-add-001.html (1041B)
1 <!-- Quirks mode --> 2 <meta charset="utf-8"> 3 <title>Invalidation of style due to a dynamic stylesheet change in quirks mode</title> 4 <link rel="help" href="https://html.spec.whatwg.org/#case-sensitivity-of-selectors"> 5 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1433589"> 6 <link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <style> 10 #foo { 11 width: 100px; 12 height: 100px; 13 background: red; 14 } 15 </style> 16 Should see a green square below. 17 <div id="foo"></div> 18 <script> 19 test(function() { 20 let foo = document.getElementById('foo'); 21 assert_equals(getComputedStyle(foo).backgroundColor, "rgb(255, 0, 0)"); 22 let style = document.createElement('style'); 23 style.textContent = "#FoO { background: green; }"; 24 document.body.appendChild(style); 25 assert_equals(getComputedStyle(foo).backgroundColor, "rgb(0, 128, 0)"); 26 }, "Style should've changed to a green background"); 27 </script>