change cloneImageElement() to return clone every time (#37811)
diff --git a/lib/web_ui/lib/src/engine/html_image_codec.dart b/lib/web_ui/lib/src/engine/html_image_codec.dart
index 7424644..d5db33f 100644
--- a/lib/web_ui/lib/src/engine/html_image_codec.dart
+++ b/lib/web_ui/lib/src/engine/html_image_codec.dart
@@ -143,7 +143,7 @@
}
final DomHTMLImageElement imgElement;
- bool _requiresClone = false;
+ bool _didClone = false;
bool _disposed = false;
@override
@@ -204,16 +204,12 @@
}
}
- // Returns absolutely positioned actual image element on first call and
- // clones on subsequent calls.
DomHTMLImageElement cloneImageElement() {
- if (_requiresClone) {
- return imgElement.cloneNode(true) as DomHTMLImageElement;
- } else {
- _requiresClone = true;
+ if (!_didClone) {
+ _didClone = true;
imgElement.style.position = 'absolute';
- return imgElement;
}
+ return imgElement.cloneNode(true) as DomHTMLImageElement;
}
@override
diff --git a/lib/web_ui/test/html/compositing/canvas_image_blend_mode_golden_test.dart b/lib/web_ui/test/html/compositing/canvas_image_blend_mode_golden_test.dart
index a4ad2e2..3b98510 100644
--- a/lib/web_ui/test/html/compositing/canvas_image_blend_mode_golden_test.dart
+++ b/lib/web_ui/test/html/compositing/canvas_image_blend_mode_golden_test.dart
@@ -111,6 +111,25 @@
rc.restore();
await canvasScreenshot(rc, 'canvas_image_blend_and_text');
});
+
+ test('Does not re-use styles with same image src', () async {
+ final RecordingCanvas rc = RecordingCanvas(
+ const Rect.fromLTRB(0, 0, 400, 400));
+ final HtmlImage flutterImage = createFlutterLogoTestImage();
+ rc.save();
+ rc.drawRect(const Rect.fromLTWH(0, 50, 200, 50), makePaint()
+ ..color = white);
+ rc.drawImage(flutterImage, const Offset(0, 50),
+ makePaint()
+ ..colorFilter = const EngineColorFilter.mode(red, BlendMode.modulate));
+
+ // Expect that the colorFilter is only applied to the first image, since the
+ // colorFilter is applied to a clone of the flutterImage and not the original
+ rc.drawImage(flutterImage, const Offset(0, 100), makePaint());
+
+ rc.restore();
+ await canvasScreenshot(rc, 'canvas_image_same_src');
+ });
}
Paragraph createTestParagraph() {
