style-src-inline-style-nonce-blocked-error-event.html (2564B)
1 <!doctype html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Security-Policy" content="style-src 'nonce-nonceynonce';"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 8 <script> 9 var t_spv = async_test("Should fire a securitypolicyviolation event"); 10 11 document.addEventListener("securitypolicyviolation", t_spv.step_func_done(function(e) { 12 assert_equals("style-src-elem", e.violatedDirective); 13 })); 14 </script> 15 </head> 16 <body> 17 <div id='log'></div> 18 19 <div id="content">Lorem ipsum</div> 20 21 <script> 22 function verifyStep1() { 23 var marginLeft = getComputedStyle(document.querySelector("#content")).getPropertyValue('margin-left'); 24 assert_not_equals(marginLeft, '2px', "Content still does not have a 2px margin-left after initial style."); 25 } 26 27 function setupStep2() { 28 var sty = document.createElement("style"); 29 sty.nonce = "not-nonceynonce"; 30 sty.innerHTML = "#content { margin-left: 2px; }"; 31 sty.onerror = styleError; 32 document.body.appendChild(sty); 33 } 34 function verifyStep2() { 35 var marginLeft = getComputedStyle(document.querySelector("#content")).getPropertyValue('margin-left'); 36 assert_not_equals(marginLeft, '2px', "Content still does not have a 2px margin-left after inserted style."); 37 } 38 39 function setupStep3() { 40 var e = document.getElementById('style1'); 41 e.innerHTML = "#content { margin-left: 2px; }"; 42 } 43 function verifyStep3() { 44 var marginLeft = getComputedStyle(document.querySelector("#content")).getPropertyValue('margin-left'); 45 assert_not_equals(marginLeft, '2px', "Content still does not have a 2px margin-left after changing style."); 46 test.done(); 47 } 48 49 var verifySteps = [ verifyStep1, verifyStep2, verifyStep3 ]; 50 var setupSteps = [ setupStep2, setupStep3 ]; 51 52 var test = async_test("Test that paragraph remains unmodified and error events received."); 53 54 function styleError() { 55 test.step(function() { 56 verifySteps.shift()(); 57 var nextSetup = setupSteps.shift(); 58 if (nextSetup) 59 nextSetup(); 60 }); 61 } 62 </script> 63 64 <style id="style1" nonce="not-nonceynonce" 65 onerror="styleError();"> 66 #content { 67 margin-left: 2px; 68 } 69 </style> 70 </body> 71 </html>