style-element-csp-allowed.html (1762B)
1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8" /> 5 <meta name="author" title="Kurt Catti-Schmidt" href="mailto:kschmi@microsoft.com" /> 6 <link rel="help" href="https://html.spec.whatwg.org/multipage/semantics.html#the-style-element" /> 7 <link rel="help" href="https://github.com/MicrosoftEdge/MSEdgeExplainers/blob/main/ShadowDOM/explainer.md" /> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 11 <meta http-equiv="Content-Security-Policy" content="style-src 'self' 'unsafe-inline' data: blob:;"> 12 13 <script> 14 const t1 = async_test("Test securitypolicyviolation event doesn't fire on Declarative CSS Module when allowed via CSP"); 15 document.documentElement.addEventListener("securitypolicyviolation", t1.unreached_func("securitypolicyviolation error fired.")); 16 17 const t2 = async_test("Test error event doesn't fire on Declarative CSS Module when allowed via CSP"); 18 </script> 19 20 <style type="module" specifier="foo" onerror="t2.unreached_func('onerror fired');"> 21 #test {color:blue} 22 </style> 23 24 </head> 25 <body> 26 27 <div id="test">Test content</div> 28 29 <script type="module"> 30 import sheet from "foo" with { type: "css"}; 31 32 test(function (t) { 33 assert_equals( 34 sheet.cssRules.length, 35 1, 36 "Declaratively defined rules were imported with `unsafe-inline` CSP.", 37 ); 38 39 document.adoptedStyleSheets = [sheet]; 40 const test_element = document.getElementById("test"); 41 assert_equals(getComputedStyle(test_element) 42 .color, "rgb(0, 0, 255)", 43 "Declarative styles were applied."); 44 45 }, "CSS Modules can be defined declaratively with `style-src` CSP set to `unsafe-inline` with the data protocol permitted."); 46 t1.done(); 47 t2.done(); 48 </script> 49 </body> 50 </html>