WIP

lib/web_ui/lib/semantics.dart

@@ -280,14 +280,14 @@ class SemanticsUpdateBuilder {
     required List<StringAttribute> decreasedValueAttributes,
     required String hint,
     required List<StringAttribute> hintAttributes,
-    String? tooltip,
-    TextDirection? textDirection,
+    required String? tooltip,
+    required TextDirection? textDirection,
     required Float64List transform,
     required Int32List childrenInTraversalOrder,
     required Int32List childrenInHitTestOrder,
     required Int32List additionalActions,
-    int headingLevel = 0,
-    String? linkUrl,
+    required int headingLevel,
+    required String? linkUrl,
   }) {
     if (transform.length != 16) {
       throw ArgumentError('transform argument must have 16 entries.');

lib/web_ui/lib/src/engine/canvaskit/image.dart

@@ -30,14 +30,113 @@ Future<ui.Codec> skiaInstantiateImageCodec(Uint8List list,
     final DomBlob blob = createDomBlob(<ByteBuffer>[list.buffer]);
     codec = await decodeBlobToCkImage(blob);
   }
-  return ResizingCodec(
+  return CkResizingCodec(
     codec,
     targetWidth: targetWidth,
     targetHeight: targetHeight,
     allowUpscaling: allowUpscaling,
   );
 }
 
+/// A resizing codec which uses an HTML <canvas> element to scale the image if
+/// it is backed by an HTML Image element.
+class CkResizingCodec extends ResizingCodec {
+  CkResizingCodec(
+    super.delegate, {
+    super.targetWidth,
+    super.targetHeight,
+    super.allowUpscaling,
+  });
+
+  @override
+  ui.Image scaleImage(
+    ui.Image image, {
+    int? targetWidth,
+    int? targetHeight,
+    bool allowUpscaling = true,
+  }) {
+    final CkImage ckImage = image as CkImage;
+    if (ckImage.imageElement == null) {
+      return scaleImageIfNeeded(
+        image,
+        targetWidth: targetWidth,
+        targetHeight: targetHeight,
+        allowUpscaling: allowUpscaling,
+      );
+    } else {
+      return _scaleImageUsingDomCanvas(
+        ckImage,
+        targetWidth: targetWidth,
+        targetHeight: targetHeight,
+        allowUpscaling: allowUpscaling,
+      );
+    }
+  }
+
+  CkImage _scaleImageUsingDomCanvas(
+    CkImage image, {
+    int? targetWidth,
+    int? targetHeight,
+    bool allowUpscaling = true,
+  }) {
+    assert(image.imageElement != null);
+    final int width = image.width;
+    final int height = image.height;
+    final ui.Size? scaledSize =
+        scaledImageSize(width, height, targetWidth, targetHeight);
+    if (scaledSize == null) {
+      return image;
+    }
+    if (!allowUpscaling &&
+        (scaledSize.width > width || scaledSize.height > height)) {
+      return image;
+    }
+
+    final int scaledWidth = scaledSize.width.toInt();
+    final int scaledHeight = scaledSize.height.toInt();
+
+    final DomCanvasElement htmlCanvas = createDomCanvasElement(
+      width: scaledWidth,
+      height: scaledHeight,
+    );
+    final DomCanvasRenderingContext2D ctx =
+        htmlCanvas.getContext('2d')! as DomCanvasRenderingContext2D;
+    ctx.drawImage(
+      image.imageElement!,
+      0,
+      0,
+      width,
+      height,
+      0,
+      0,
+      scaledWidth,
+      scaledHeight,
+    );
+    final DomImageData imageData =
+        ctx.getImageData(0, 0, scaledWidth, scaledHeight);
+    final Uint8List pixels = imageData.data.buffer.asUint8List();
+
+    final SkImage? skImage = canvasKit.MakeImage(
+      SkImageInfo(
+        width: scaledWidth.toDouble(),
+        height: scaledHeight.toDouble(),
+        colorType: canvasKit.ColorType.RGBA_8888,
+        alphaType: canvasKit.AlphaType.Premul,
+        colorSpace: SkColorSpaceSRGB,
+      ),
+      pixels,
+      (4 * scaledWidth).toDouble(),
+    );
+
+    if (skImage == null) {
+      domWindow.console.warn('Failed to scale image.');
+      return image;
+    }
+
+    return CkImage(skImage);
+  }
+}
+
 ui.Image createCkImageFromImageElement(
   DomHTMLImageElement image,
   int naturalWidth,
@@ -212,9 +311,6 @@ CkImage scaleImage(SkImage image, int? targetWidth, int? targetHeight) {
   return ckImage;
 }
 
-CkImage scaleImageWithCanvas(
-    SkImage image, int? targetWidth, int? targetHeight) {}
-
 /// Thrown when the web engine fails to decode an image, either due to a
 /// network issue, corrupted image contents, or missing codec.
 class ImageCodecException implements Exception {

lib/web_ui/lib/src/engine/image_decoder.dart

@@ -381,18 +381,31 @@ class ResizingCodec implements ui.Codec {
     final ui.FrameInfo frameInfo = await delegate.getNextFrame();
     return AnimatedImageFrameInfo(
       frameInfo.duration,
-      scaleImageIfNeeded(frameInfo.image,
+      scaleImage(frameInfo.image,
           targetWidth: targetWidth,
           targetHeight: targetHeight,
           allowUpscaling: allowUpscaling),
     );
   }
 
+  ui.Image scaleImage(
+    ui.Image image, {
+    int? targetWidth,
+    int? targetHeight,
+    bool allowUpscaling = true,
+  }) =>
+      scaleImageIfNeeded(
+        image,
+        targetWidth: targetWidth,
+        targetHeight: targetHeight,
+        allowUpscaling: allowUpscaling,
+      );
+
   @override
   int get repetitionCount => delegate.frameCount;
 }
 
-ui.Size? _scaledSize(
+ui.Size? scaledImageSize(
   int width,
   int height,
   int? targetWidth,
@@ -427,7 +440,7 @@ ui.Image scaleImageIfNeeded(
   final int width = image.width;
   final int height = image.height;
   final ui.Size? scaledSize =
-      _scaledSize(width, height, targetWidth, targetHeight);
+      scaledImageSize(width, height, targetWidth, targetHeight);
   if (scaledSize == null) {
     return image;
   }