LibWeb: Add ImageData constructor with data

Author: https://github.com/kennethmyhra
Commit: c17171b86c
Pull-request: https://github.com/SerenityOS/serenity/pull/23727
Reviewed-by: https://github.com/Lubrsi

Tests/LibWeb/Text/input/HTML/ImageData-create-with-size.html

@@ -5,5 +5,17 @@
         let imageData = new ImageData(100, 100);
         println(imageData.data);
         println(imageData.data.length);
+
+        const arr = new Uint8ClampedArray(40_000);
+        // Fill the array with the same RGBA values
+        for (let i = 0; i < arr.length; i += 4) {
+            arr[i + 0] = 0; // R value
+            arr[i + 1] = 190; // G value
+            arr[i + 2] = 0; // B value
+            arr[i + 3] = 255; // A value
+        }
+        imageData = new ImageData(arr, 200);
+        println(imageData.data);
+        println(imageData.data.length);
     });
 </script>

Userland/Libraries/LibWeb/HTML/ImageData.cpp

@@ -9,6 +9,7 @@
 #include <LibJS/Runtime/TypedArray.h>
 #include <LibWeb/Bindings/Intrinsics.h>
 #include <LibWeb/HTML/ImageData.h>
+#include <LibWeb/WebIDL/Buffers.h>
 #include <LibWeb/WebIDL/DOMException.h>
 #include <LibWeb/WebIDL/ExceptionOr.h>
 
@@ -37,6 +38,50 @@ WebIDL::ExceptionOr<JS::NonnullGCPtr<ImageData>> ImageData::construct_impl(JS::R
     return ImageData::create(realm, sw, sh, settings);
 }
 
+// https://html.spec.whatwg.org/multipage/canvas.html#dom-imagedata-with-data
+WebIDL::ExceptionOr<JS::NonnullGCPtr<ImageData>> ImageData::create(JS::Realm& realm, JS::Handle<WebIDL::BufferSource> const& data, u32 sw, Optional<u32> sh, Optional<ImageDataSettings> const&)
+{
+    auto& vm = realm.vm();
+
+    if (!is<JS::Uint8ClampedArray>(*data->raw_object()))
+        return vm.throw_completion<JS::TypeError>(JS::ErrorType::NotAnObjectOfType, "Uint8ClampedArray");
+
+    auto& uint8_clamped_array_data = static_cast<JS::Uint8ClampedArray&>(*data->raw_object());
+
+    // 1. Let length be the number of bytes in data.
+    auto length = uint8_clamped_array_data.byte_length().length();
+
+    // 2. If length is not a nonzero integral multiple of four, then throw an "InvalidStateError" DOMException.
+    if (length == 0 || length % 4 != 0)
+        return WebIDL::InvalidStateError::create(realm, "Source data must have a non-sero length that is a multiple of four."_fly_string);
+
+    // 3. Let length be length divided by four.
+    length = length / 4;
+
+    // 4. If length is not an integral multiple of sw, then throw an "IndexSizeError" DOMException.
+    // NOTE: At this step, the length is guaranteed to be greater than zero (otherwise the second step above would have aborted the steps),
+    //       so if sw is zero, this step will throw the exception and return.
+    if (sw == 0 || length % sw != 0)
+        return WebIDL::IndexSizeError::create(realm, "Source width must be a multiple of source data's length."_fly_string);
+
+    // 5. Let height be length divided by sw.
+    auto height = length / sw;
+
+    // 6. If sh was given and its value is not equal to height, then throw an "IndexSizeError" DOMException.
+    if (sh.has_value() && sh.value() != height)
+        return WebIDL::IndexSizeError::create(realm, "Source height must be equal to the calculated height of the data."_fly_string);
+
+    // 7. Initialize this given sw, sh, settings set to settings, and source set to data.
+    auto bitmap = TRY_OR_THROW_OOM(vm, Gfx::Bitmap::create_wrapper(Gfx::BitmapFormat::RGBA8888, Gfx::IntSize(sw, sw), 1, sw * sizeof(u32), uint8_clamped_array_data.data().data()));
+
+    return realm.heap().allocate<ImageData>(realm, realm, bitmap, uint8_clamped_array_data);
+}
+
+WebIDL::ExceptionOr<JS::NonnullGCPtr<ImageData>> ImageData::construct_impl(JS::Realm& realm, JS::Handle<WebIDL::BufferSource> const& data, u32 sw, Optional<u32> sh, Optional<ImageDataSettings> const& settings)
+{
+    return ImageData::create(realm, data, sw, move(sh), settings);
+}
+
 ImageData::ImageData(JS::Realm& realm, NonnullRefPtr<Gfx::Bitmap> bitmap, JS::NonnullGCPtr<JS::Uint8ClampedArray> data)
     : PlatformObject(realm)
     , m_bitmap(move(bitmap))

Userland/Libraries/LibWeb/HTML/ImageData.h

@@ -23,7 +23,10 @@ class ImageData final : public Bindings::PlatformObject {
 
 public:
     [[nodiscard]] static WebIDL::ExceptionOr<JS::NonnullGCPtr<ImageData>> create(JS::Realm&, u32 sw, u32 sh, Optional<ImageDataSettings> const& settings = {});
+    [[nodiscard]] static WebIDL::ExceptionOr<JS::NonnullGCPtr<ImageData>> create(JS::Realm&, JS::Handle<WebIDL::BufferSource> const& data, u32 sw, Optional<u32> sh = {}, Optional<ImageDataSettings> const& settings = {});
+
     [[nodiscard]] static WebIDL::ExceptionOr<JS::NonnullGCPtr<ImageData>> construct_impl(JS::Realm&, u32 sw, u32 sh, Optional<ImageDataSettings> const& settings = {});
+    [[nodiscard]] static WebIDL::ExceptionOr<JS::NonnullGCPtr<ImageData>> construct_impl(JS::Realm&, JS::Handle<WebIDL::BufferSource> const& data, u32 sw, Optional<u32> sh = {}, Optional<ImageDataSettings> const& settings = {});
 
     virtual ~ImageData() override;
 

Userland/Libraries/LibWeb/HTML/ImageData.idl

@@ -9,7 +9,7 @@ dictionary ImageDataSettings {
 [Exposed=(Window,Worker), Serializable]
 interface ImageData {
     constructor(unsigned long sw, unsigned long sh, optional ImageDataSettings settings = {});
-    // FIXME: constructor(Uint8ClampedArray data, unsigned long sw, optional unsigned long sh, optional ImageDataSettings settings = {});
+    constructor(Uint8ClampedArray data, unsigned long sw, optional unsigned long sh, optional ImageDataSettings settings = {});
     readonly attribute unsigned long width;
     readonly attribute unsigned long height;
     readonly attribute Uint8ClampedArray data;