Fix platform view transforms in CanvasKit (#22945)

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

@@ -239,7 +239,7 @@ class HtmlViewEmbedder {
     for (final Mutator mutator in mutators) {
       switch (mutator.type) {
         case MutatorType.transform:
-          headTransform.multiply(mutator.matrix!);
+          headTransform = mutator.matrix!.multiplied(headTransform);
           head.style.transform =
               float64ListToCssTransform(headTransform.storage);
           break;

lib/web_ui/test/canvaskit/embedded_views_test.dart

@@ -15,7 +15,8 @@ import 'package:test/test.dart';
 import 'common.dart';
 
 const MethodCodec codec = StandardMethodCodec();
-final EngineSingletonFlutterWindow window = EngineSingletonFlutterWindow(0, EnginePlatformDispatcher.instance);
+final EngineSingletonFlutterWindow window =
+    EngineSingletonFlutterWindow(0, EnginePlatformDispatcher.instance);
 
 void main() {
   internalBootstrapBrowserTest(() => testMain);
@@ -32,16 +33,52 @@ void testMain() {
       );
       await _createPlatformView(0, 'test-platform-view');
 
-      final EnginePlatformDispatcher dispatcher = ui.window.platformDispatcher as EnginePlatformDispatcher;
+      final EnginePlatformDispatcher dispatcher =
+          ui.window.platformDispatcher as EnginePlatformDispatcher;
       final LayerSceneBuilder sb = LayerSceneBuilder();
       sb.pushOffset(0, 0);
       sb.addPlatformView(0, width: 10, height: 10);
       dispatcher.rasterizer!.draw(sb.build().layerTree);
       expect(
-        domRenderer.sceneElement!.querySelectorAll('#view-0').single.style.pointerEvents,
+        domRenderer.sceneElement!
+            .querySelectorAll('#view-0')
+            .single
+            .style
+            .pointerEvents,
         'auto',
       );
     });
+
+    test('correctly transforms platform views', () async {
+      ui.platformViewRegistry.registerViewFactory(
+        'test-platform-view',
+        (viewId) => html.DivElement()..id = 'view-0',
+      );
+      await _createPlatformView(0, 'test-platform-view');
+
+      final EnginePlatformDispatcher dispatcher =
+          ui.window.platformDispatcher as EnginePlatformDispatcher;
+      final LayerSceneBuilder sb = LayerSceneBuilder();
+      sb.pushOffset(0, 0);
+      Matrix4 scaleMatrix = Matrix4.identity()
+        ..scale(5, 5)
+        ..translate(100, 100);
+      sb.pushTransform(scaleMatrix.toFloat64());
+      sb.pushOffset(3, 3);
+      sb.addPlatformView(0, width: 10, height: 10);
+      dispatcher.rasterizer!.draw(sb.build().layerTree);
+      expect(
+        domRenderer.sceneElement!
+            .querySelectorAll('#view-0')
+            .single
+            .style
+            .transform,
+        // We should apply the scale matrix first, then the offset matrix.
+        // So the translate should be 515 (5 * 100 + 5 * 3), and not
+        // 503 (5 * 100 + 3).
+        'matrix3d(5, 0, 0, 0, 0, 5, 0, 0, 0, 0, 5, 0, 515, 515, 0, 1)',
+      );
+    });
     // TODO: https://github.com/flutter/flutter/issues/60040
   }, skip: isIosSafari);
 }