LibWeb: Create canvas bitmap when not existing in toDataURL and toBlob

Tests/LibWeb/Text/expected/canvas/export.txt

@@ -0,0 +1 @@
+1. "image/png"

Tests/LibWeb/Text/input/canvas/export.html

@@ -0,0 +1,22 @@
+<script src="../include.js"></script>
+<script>
+    test(() => {
+        let testCounter = 1;
+        function testPart(part) {
+            println(`${testCounter++}. ${JSON.stringify(part())}`);
+        }
+
+        // 1. Export a canvas to PNG data URL
+        testPart(() => {
+            const canvas = document.createElement('canvas');
+            return canvas.toDataURL('image/png').substring(5, 14);
+        });
+
+        // 2. Export a canvas to JPEG data URL
+        // FIXME: This fails on macOS: https://github.com/SerenityOS/serenity/issues/21108
+        // testPart(() => {
+        //     const canvas = document.createElement('canvas');
+        //     return canvas.toDataURL('image/jpeg').substring(5, 15);
+        // });
+    });
+</script>

Userland/Libraries/LibWeb/HTML/HTMLCanvasElement.cpp

@@ -246,8 +246,12 @@ static ErrorOr<SerializeBitmapResult> serialize_bitmap(Gfx::Bitmap const& bitmap
 }
 
 // https://html.spec.whatwg.org/multipage/canvas.html#dom-canvas-todataurl
-String HTMLCanvasElement::to_data_url(StringView type, Optional<double> quality) const
+String HTMLCanvasElement::to_data_url(StringView type, Optional<double> quality)
 {
+    // It is possible the the canvas doesn't have a associated bitmap so create one
+    if (!bitmap())
+        create_bitmap();
+
     // FIXME: 1. If this canvas element's bitmap's origin-clean flag is set to false, then throw a "SecurityError" DOMException.
 
     // 2. If this canvas element's bitmap has no pixels (i.e. either its horizontal dimension or its vertical dimension is zero)
@@ -275,6 +279,10 @@ String HTMLCanvasElement::to_data_url(StringView type, Optional<double> quality)
 // https://html.spec.whatwg.org/multipage/canvas.html#dom-canvas-toblob
 WebIDL::ExceptionOr<void> HTMLCanvasElement::to_blob(JS::NonnullGCPtr<WebIDL::CallbackType> callback, StringView type, Optional<double> quality)
 {
+    // It is possible the the canvas doesn't have a associated bitmap so create one
+    if (!bitmap())
+        create_bitmap();
+
     // FIXME: 1. If this canvas element's bitmap's origin-clean flag is set to false, then throw a "SecurityError" DOMException.
 
     // 2. Let result be null.

Userland/Libraries/LibWeb/HTML/HTMLCanvasElement.h

@@ -33,7 +33,7 @@ public:
     WebIDL::ExceptionOr<void> set_width(unsigned);
     WebIDL::ExceptionOr<void> set_height(unsigned);
 
-    String to_data_url(StringView type, Optional<double> quality) const;
+    String to_data_url(StringView type, Optional<double> quality);
     WebIDL::ExceptionOr<void> to_blob(JS::NonnullGCPtr<WebIDL::CallbackType> callback, StringView type, Optional<double> quality);
 
     void present();

Userland/Libraries/LibWeb/WebDriver/Screenshot.cpp

@@ -24,7 +24,7 @@
 namespace Web::WebDriver {
 
 // https://w3c.github.io/webdriver/#dfn-encoding-a-canvas-as-base64
-static Response encode_canvas_element(HTML::HTMLCanvasElement const& canvas)
+static Response encode_canvas_element(HTML::HTMLCanvasElement& canvas)
 {
     // FIXME: 1. If the canvas element’s bitmap’s origin-clean flag is set to false, return error with error code unable to capture screen.