feat(ext/web): add ImageData Web API (#21183)

Fixes #19288

Adds the `ImageData` Web API. 

This would be beneficial to projects using `ImageData` as a convenient
transport layer for pixel data. This is common in Web Assembly projects
that manipulate images. Having this global available in Deno would
improve compatibility of existing JS libraries.

**References**
- [MDN ImageData Web
API](https://developer.mozilla.org/en-US/docs/Web/API/ImageData)
- [whatwg HTML Standard Canvas
Spec](https://html.spec.whatwg.org/multipage/canvas.html#pixel-manipulation)

3 files changed, 56 insertions, 0 deletions

diff --git a/cli/tests/integration/js_unit_tests.rs b/cli/tests/integration/js_unit_tests.rs
index bdab48926..165ab25bf 100644
--- a/cli/tests/integration/js_unit_tests.rs
+++ b/cli/tests/integration/js_unit_tests.rs
@@ -42,6 +42,7 @@ util::unit_test_factory!(
     globals_test,
     headers_test,
     http_test,
+    image_data_test,
     internals_test,
     intl_test,
     io_test,
diff --git a/cli/tests/testdata/workers/image_data_worker.ts b/cli/tests/testdata/workers/image_data_worker.ts
new file mode 100644
index 000000000..bf920d2f3
--- /dev/null
+++ b/cli/tests/testdata/workers/image_data_worker.ts
@@ -0,0 +1,2 @@
+const data = new ImageData(2, 2, { colorSpace: "display-p3" });
+postMessage(data.data.length);
diff --git a/cli/tests/unit/image_data_test.ts b/cli/tests/unit/image_data_test.ts
new file mode 100644
index 000000000..ea5d64dbb
--- /dev/null
+++ b/cli/tests/unit/image_data_test.ts
@@ -0,0 +1,53 @@
+// Copyright 2018-2023 the Deno authors. All rights reserved. MIT license.
+
+import { assertEquals } from "./test_util.ts";
+
+Deno.test(function imageDataInitializedWithSourceWidthAndHeight() {
+  const imageData = new ImageData(16, 9);
+
+  assertEquals(imageData.width, 16);
+  assertEquals(imageData.height, 9);
+  assertEquals(imageData.data.length, 16 * 9 * 4); // width * height * 4 (RGBA pixels)
+  assertEquals(imageData.colorSpace, "srgb");
+});
+
+Deno.test(function imageDataInitializedWithImageDataAndWidth() {
+  const imageData = new ImageData(new Uint8ClampedArray(16 * 9 * 4), 16);
+
+  assertEquals(imageData.width, 16);
+  assertEquals(imageData.height, 9);
+  assertEquals(imageData.data.length, 16 * 9 * 4); // width * height * 4 (RGBA pixels)
+  assertEquals(imageData.colorSpace, "srgb");
+});
+
+Deno.test(
+  function imageDataInitializedWithImageDataAndWidthAndHeightAndColorSpace() {
+    const imageData = new ImageData(new Uint8ClampedArray(16 * 9 * 4), 16, 9, {
+      colorSpace: "display-p3",
+    });
+
+    assertEquals(imageData.width, 16);
+    assertEquals(imageData.height, 9);
+    assertEquals(imageData.data.length, 16 * 9 * 4); // width * height * 4 (RGBA pixels)
+    assertEquals(imageData.colorSpace, "display-p3");
+  },
+);
+
+Deno.test(
+  async function imageDataUsedInWorker() {
+    const { promise, resolve } = Promise.withResolvers<void>();
+    const url = import.meta.resolve(
+      "../testdata/workers/image_data_worker.ts",
+    );
+    const expectedData = 16;
+
+    const worker = new Worker(url, { type: "module" });
+    worker.onmessage = function (e) {
+      assertEquals(expectedData, e.data);
+      worker.terminate();
+      resolve();
+    };
+
+    await promise;
+  },
+);