| <!DOCTYPE html> |
| <title>Service Worker: FetchEvent for css image</title> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script src="/common/get-host-info.sub.js"></script> |
| <script src="resources/test-helpers.sub.js?pipe=sub"></script> |
| <script> |
| var SCOPE = 'resources/fetch-request-resources-iframe.https.html'; |
| var SCRIPT = 'resources/fetch-request-resources-worker.js'; |
| var host_info = get_host_info(); |
| var LOCAL_URL = |
| host_info['HTTPS_ORIGIN'] + base_path() + 'resources/sample?test'; |
| var REMOTE_URL = |
| host_info['HTTPS_REMOTE_ORIGIN'] + base_path() + 'resources/sample?test'; |
| |
| function css_image_test(expected_results, frame, url, type, |
| expected_mode, expected_credentials) { |
| expected_results[url] = { |
| url: url, |
| mode: expected_mode, |
| credentials: expected_credentials, |
| message: 'CSSImage load (url:' + url + ' type:' + type + ')' |
| }; |
| return frame.contentWindow.load_css_image(url, type); |
| } |
| |
| function css_image_set_test(expected_results, frame, url, type, |
| expected_mode, expected_credentials) { |
| expected_results[url] = { |
| url: url, |
| mode: expected_mode, |
| credentials: expected_credentials, |
| message: 'CSSImageSet load (url:' + url + ' type:' + type + ')' |
| }; |
| return frame.contentWindow.load_css_image_set(url, type); |
| } |
| |
| function waitForWorker(worker) { |
| return new Promise(function(resolve) { |
| var channel = new MessageChannel(); |
| channel.port1.addEventListener('message', function(msg) { |
| if (msg.data.ready) { |
| resolve(channel); |
| } |
| }); |
| channel.port1.start(); |
| worker.postMessage({port: channel.port2}, [channel.port2]); |
| }); |
| } |
| |
| function create_message_promise(channel, expected_results, worker, scope) { |
| return new Promise(function(resolve) { |
| channel.port1.addEventListener('message', function(msg) { |
| var result = msg.data; |
| if (!expected_results[result.url]) { |
| return; |
| } |
| resolve(result); |
| }); |
| }).then(function(result) { |
| var expected = expected_results[result.url]; |
| assert_equals( |
| result.mode, expected.mode, |
| 'mode of ' + expected.message + ' must be ' + |
| expected.mode + '.'); |
| assert_equals( |
| result.credentials, expected.credentials, |
| 'credentials of ' + expected.message + ' must be ' + |
| expected.credentials + '.'); |
| delete expected_results[result.url]; |
| }); |
| } |
| |
| promise_test(function(t) { |
| var scope = SCOPE + "?img=backgroundImage"; |
| var expected_results = {}; |
| var worker; |
| var frame; |
| return service_worker_unregister_and_register(t, SCRIPT, scope) |
| .then(function(registration) { |
| t.add_cleanup(function() { |
| return service_worker_unregister(t, scope); |
| }); |
| |
| worker = registration.installing; |
| return wait_for_state(t, worker, 'activated'); |
| }) |
| .then(function() { return with_iframe(scope); }) |
| .then(function(f) { |
| t.add_cleanup(function() { |
| f.remove(); |
| }); |
| frame = f; |
| return waitForWorker(worker); |
| }) |
| .then(function(channel) { |
| css_image_test(expected_results, frame, LOCAL_URL + Date.now(), |
| 'backgroundImage', 'no-cors', 'include'); |
| css_image_test(expected_results, frame, REMOTE_URL + Date.now(), |
| 'backgroundImage', 'no-cors', 'include'); |
| |
| return Promise.all([ |
| create_message_promise(channel, expected_results, worker, scope), |
| create_message_promise(channel, expected_results, worker, scope) |
| ]); |
| }); |
| }, 'Verify FetchEvent for css image (backgroundImage).'); |
| |
| promise_test(function(t) { |
| var scope = SCOPE + "?img=shapeOutside"; |
| var expected_results = {}; |
| var worker; |
| var frame; |
| return service_worker_unregister_and_register(t, SCRIPT, scope) |
| .then(function(registration) { |
| t.add_cleanup(function() { |
| return service_worker_unregister(t, scope); |
| }); |
| |
| worker = registration.installing; |
| return wait_for_state(t, worker, 'activated'); |
| }) |
| .then(function() { return with_iframe(scope); }) |
| .then(function(f) { |
| t.add_cleanup(function() { |
| f.remove(); |
| }); |
| frame = f; |
| return waitForWorker(worker); |
| }) |
| .then(function(channel) { |
| css_image_test(expected_results, frame, LOCAL_URL + Date.now(), |
| 'shapeOutside', 'cors', 'same-origin'); |
| css_image_test(expected_results, frame, REMOTE_URL + Date.now(), |
| 'shapeOutside', 'cors', 'same-origin'); |
| |
| return Promise.all([ |
| create_message_promise(channel, expected_results, worker, scope), |
| create_message_promise(channel, expected_results, worker, scope) |
| ]); |
| }); |
| }, 'Verify FetchEvent for css image (shapeOutside).'); |
| |
| promise_test(function(t) { |
| var scope = SCOPE + "?img_set=backgroundImage"; |
| var expected_results = {}; |
| var worker; |
| var frame; |
| return service_worker_unregister_and_register(t, SCRIPT, scope) |
| .then(function(registration) { |
| t.add_cleanup(function() { |
| return service_worker_unregister(t, scope); |
| }); |
| |
| worker = registration.installing; |
| return wait_for_state(t, worker, 'activated'); |
| }) |
| .then(function() { return with_iframe(scope); }) |
| .then(function(f) { |
| t.add_cleanup(function() { |
| f.remove();; |
| }); |
| frame = f; |
| return waitForWorker(worker); |
| }) |
| .then(function(channel) { |
| css_image_set_test(expected_results, frame, LOCAL_URL + Date.now(), |
| 'backgroundImage', 'no-cors', 'include'); |
| css_image_set_test(expected_results, frame, REMOTE_URL + Date.now(), |
| 'backgroundImage', 'no-cors', 'include'); |
| |
| return Promise.all([ |
| create_message_promise(channel, expected_results, worker, scope), |
| create_message_promise(channel, expected_results, worker, scope) |
| ]); |
| }); |
| }, 'Verify FetchEvent for css image-set (backgroundImage).'); |
| |
| promise_test(function(t) { |
| var scope = SCOPE + "?img_set=shapeOutside"; |
| var expected_results = {}; |
| var worker; |
| var frame; |
| return service_worker_unregister_and_register(t, SCRIPT, scope) |
| .then(function(registration) { |
| t.add_cleanup(function() { |
| return service_worker_unregister(t, scope); |
| }); |
| |
| worker = registration.installing; |
| return wait_for_state(t, worker, 'activated'); |
| }) |
| .then(function() { return with_iframe(scope); }) |
| .then(function(f) { |
| t.add_cleanup(function() { |
| f.remove(); |
| }); |
| frame = f; |
| return waitForWorker(worker); |
| }) |
| .then(function(channel) { |
| css_image_set_test(expected_results, frame, LOCAL_URL + Date.now(), |
| 'shapeOutside', 'cors', 'same-origin'); |
| css_image_set_test(expected_results, frame, REMOTE_URL + Date.now(), |
| 'shapeOutside', 'cors', 'same-origin'); |
| |
| return Promise.all([ |
| create_message_promise(channel, expected_results, worker, scope), |
| create_message_promise(channel, expected_results, worker, scope) |
| ]); |
| }); |
| }, 'Verify FetchEvent for css image-set (shapeOutside).'); |
| |
| </script> |