1 files changed, 68 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/semantics/embedded-content/the-img-element/list-of-available-images-matching.https.html b/testing/web-platform/tests/html/semantics/embedded-content/the-img-element/list-of-available-images-matching.https.html
new file mode 100644
index 0000000000..4843d21915
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/embedded-content/the-img-element/list-of-available-images-matching.https.html
@@ -0,0 +1,68 @@
+<!doctype html>
+<html>
+<title>List of available images tuple-matching logic</title>
+<link rel="author" title="Dom Farolino" href="mailto:dom@chromium.org">
+<link rel="help" href="https://html.spec.whatwg.org/multipage/#the-list-of-available-images">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/service-workers/service-worker/resources/test-helpers.sub.js"></script>
+<script src="/common/get-host-info.sub.js"></script>
+
+<script>
+const path = location.origin + '/html/semantics/embedded-content/the-img-element/';
+const image_url = path + 'image-1.jpg';
+
+function syncWait(ms) {
+  const start = Date.now();
+  while (Date.now() - start < ms);
+}
+
+let sawNoCorsRequest = false;
+
+navigator.serviceWorker.onmessage = ({data}) => {
+  if (data.url === image_url && data.mode === 'no-cors') {
+    sawNoCorsRequest = true;
+  }
+};
+
+promise_test(t => {
+  return service_worker_unregister_and_register(t, 'resources/sw.js', path)
+    .then(r => {
+      return wait_for_state(t, r.installing, 'activated');
+    });
+}, 'registering service worker');
+
+promise_test(async t => {
+  const img = new Image();
+
+  function load_img_promise() {
+    return new Promise((resolve, reject) => {
+      img.onload = resolve;
+      img.onerror = e => { reject("The img should not fail to load") };
+
+      img.src = image_url;
+      // If there is not a matching image in the list of available images, the
+      // actual fetch operation is queued as a microtask, so we will see a
+      // request with mode 'cors' due to setting the crossorigin attribute
+      // below.
+      syncWait(500);
+      img.crossOrigin = 'anonymous';
+    });
+  };
+
+  await load_img_promise();
+  assert_false(sawNoCorsRequest, "The image is not fetched with mode: no-cors");
+  await new Promise(resolve => {
+    img.onload = img.onerror = resolve;
+    img.src = '';
+    img.crossOrigin = null;
+  });
+  await load_img_promise();
+  assert_false(sawNoCorsRequest, "The image is not fetched with mode: no-cors");
+
+}, 'list of available images tuple-matching logic');
+
+promise_test(t => {
+  return service_worker_unregister(t, path);
+}, 'unregistering service worker');
+</script>