fetch-request-css-cross-origin.https.html (2914B)
1 <!DOCTYPE html> 2 <title>Service Worker: Cross-origin CSS files fetched via SW.</title> 3 <script src="/resources/testharness.js"></script> 4 <script src="/resources/testharnessreport.js"></script> 5 <script src="/common/get-host-info.sub.js"></script> 6 <script src="resources/test-helpers.sub.js"></script> 7 <script> 8 9 function getElementColorInFrame(frame, id) { 10 var element = frame.contentDocument.getElementById(id); 11 var style = frame.contentWindow.getComputedStyle(element, ''); 12 return style['color']; 13 } 14 15 promise_test(async t => { 16 var SCOPE = 17 'resources/fetch-request-css-cross-origin'; 18 var SCRIPT = 19 'resources/fetch-request-css-cross-origin-worker.js'; 20 let registration = await service_worker_unregister_and_register( 21 t, SCRIPT, SCOPE); 22 promise_test(async t => { 23 await registration.unregister(); 24 }, 'cleanup global state'); 25 26 await wait_for_state(t, registration.installing, 'activated'); 27 }, 'setup global state'); 28 29 promise_test(async t => { 30 const EXPECTED_COLOR = 'rgb(0, 0, 255)'; 31 const PAGE = 32 'resources/fetch-request-css-cross-origin-mime-check-iframe.html'; 33 34 const f = await with_iframe(PAGE); 35 t.add_cleanup(() => {f.remove(); }); 36 assert_equals( 37 getElementColorInFrame(f, 'crossOriginCss'), 38 EXPECTED_COLOR, 39 'The color must be overridden by cross origin CSS.'); 40 assert_equals( 41 getElementColorInFrame(f, 'crossOriginHtml'), 42 EXPECTED_COLOR, 43 'The color must not be overridden by cross origin non CSS file.'); 44 assert_equals( 45 getElementColorInFrame(f, 'sameOriginCss'), 46 EXPECTED_COLOR, 47 'The color must be overridden by same origin CSS.'); 48 assert_equals( 49 getElementColorInFrame(f, 'sameOriginHtml'), 50 EXPECTED_COLOR, 51 'The color must be overridden by same origin non CSS file.'); 52 assert_equals( 53 getElementColorInFrame(f, 'synthetic'), 54 EXPECTED_COLOR, 55 'The color must be overridden by synthetic CSS.'); 56 }, 'MIME checking of CSS resources fetched via service worker when Content-Type is not set.'); 57 58 promise_test(async t => { 59 const PAGE = 60 'resources/fetch-request-css-cross-origin-read-contents.html'; 61 62 const f = await with_iframe(PAGE); 63 t.add_cleanup(() => {f.remove(); }); 64 assert_throws_dom('SecurityError', f.contentWindow.DOMException, () => { 65 f.contentDocument.styleSheets[0].cssRules[0].cssText; 66 }); 67 assert_equals( 68 f.contentDocument.styleSheets[1].cssRules[0].cssText, 69 '#crossOriginCss { color: blue; }', 70 'cross-origin CORS approved response'); 71 assert_equals( 72 f.contentDocument.styleSheets[2].cssRules[0].cssText, 73 '#sameOriginCss { color: blue; }', 74 'same-origin response'); 75 assert_equals( 76 f.contentDocument.styleSheets[3].cssRules[0].cssText, 77 '#synthetic { color: blue; }', 78 'service worker generated response'); 79 }, 'Same-origin policy for access to CSS resources fetched via service worker'); 80 81 </script>