[canvaskit] Fix bug where empty scene doesn't overwrite contentful sc…

…ene (flutter#26820)

lib/web_ui/dev/goldens_lock.yaml

@@ -1,2 +1,2 @@
 repository: https://github.com/flutter/goldens.git
-revision: bdf2f896cec4fa1589c277a5fbb2c73622924375
+revision: f7a59e1cd4dc3800ded4b3df6f3823ac379df40a

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

@@ -32,6 +32,8 @@ class Rasterizer {
           SurfaceFactory.instance.baseSurface.acquireFrame(layerTree.frameSize);
       HtmlViewEmbedder.instance.frameSize = layerTree.frameSize;
       final CkCanvas canvas = frame.skiaCanvas;
+      // Clear the canvas before trying to draw to it again.
+      canvas.clear(ui.Color(0x00000000));
       final Frame compositorFrame =
           context.acquireFrame(canvas, HtmlViewEmbedder.instance);
 

lib/web_ui/test/canvaskit/canvas_golden_test.dart

@@ -781,6 +781,31 @@ void testMain() {
             'საბეჭდი და ტიპოგრაფიული ინდუსტრიის უშინაარსო ტექსტია ',
       );
     });
+
+    // Make sure we clear the canvas in between frames.
+    test('empty frame after contentful frame', () async {
+      // First draw a frame with a red rectangle
+      final CkPictureRecorder recorder = CkPictureRecorder();
+      final CkCanvas canvas = recorder.beginRecording(ui.Rect.largest);
+      canvas.drawRect(ui.Rect.fromLTRB(20, 20, 100, 100),
+          CkPaint()..color = ui.Color(0xffff0000));
+      final CkPicture picture = recorder.endRecording();
+      final LayerSceneBuilder builder = LayerSceneBuilder();
+      builder.pushOffset(0, 0);
+      builder.addPicture(ui.Offset.zero, picture);
+      final LayerTree layerTree = builder.build().layerTree;
+      EnginePlatformDispatcher.instance.rasterizer!.draw(layerTree);
+
+      // Now draw an empty layer tree and confirm that the red rectangle is
+      // no longer drawn.
+      final LayerSceneBuilder emptySceneBuilder = LayerSceneBuilder();
+      emptySceneBuilder.pushOffset(0, 0);
+      final LayerTree emptyLayerTree = emptySceneBuilder.build().layerTree;
+      EnginePlatformDispatcher.instance.rasterizer!.draw(emptyLayerTree);
+
+      await matchGoldenFile('canvaskit_empty_scene.png',
+          region: ui.Rect.fromLTRB(0, 0, 100, 100));
+    });
     // TODO: https://github.com/flutter/flutter/issues/60040
     // TODO: https://github.com/flutter/flutter/issues/71520
   }, skip: isIosSafari || isFirefox);