From c4576d2103e3752ec3a88715113ffe2c22f0c24a Mon Sep 17 00:00:00 2001 From: Jim Graham Date: Mon, 31 Aug 2020 18:20:04 -0700 Subject: [PATCH 1/2] improve sensitivity of BackdropFilter web tests --- .../engine/backdrop_filter_golden_test.dart | 40 ++++++++++--------- 1 file changed, 21 insertions(+), 19 deletions(-) diff --git a/lib/web_ui/test/golden_tests/engine/backdrop_filter_golden_test.dart b/lib/web_ui/test/golden_tests/engine/backdrop_filter_golden_test.dart index 797b1cf6b34d1..930b15094b198 100644 --- a/lib/web_ui/test/golden_tests/engine/backdrop_filter_golden_test.dart +++ b/lib/web_ui/test/golden_tests/engine/backdrop_filter_golden_test.dart @@ -12,8 +12,6 @@ import 'package:ui/src/engine.dart'; import 'package:web_engine_tester/golden_tester.dart'; -final Rect region = Rect.fromLTWH(0, 0, 500, 500); - void main() { internalBootstrapBrowserTest(() => testMain); } @@ -35,22 +33,24 @@ void testMain() async { // the clip boundary around backdrop filter. However there should be only // one red dot since the other one should be blurred by filter. test('Background should only blur at ancestor clip boundary', () async { + final Rect region = Rect.fromLTWH(0, 0, 190, 130); + final SurfaceSceneBuilder builder = SurfaceSceneBuilder(); - final Picture backgroundPicture = _drawBackground(); + final Picture backgroundPicture = _drawBackground(region); builder.addPicture(Offset.zero, backgroundPicture); builder.pushClipRect( - const Rect.fromLTRB(10, 10, 300, 300), + const Rect.fromLTRB(10, 10, 180, 120), ); - final Picture circles1 = _drawTestPictureWithCircles(30, 30); + final Picture circles1 = _drawTestPictureWithCircles(region, 30, 30); builder.addPicture(Offset.zero, circles1); builder.pushClipRect( - const Rect.fromLTRB(60, 10, 300, 300), + const Rect.fromLTRB(60, 10, 180, 120), ); builder.pushBackdropFilter(ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0), oldLayer: null); - final Picture circles2 = _drawTestPictureWithCircles(90, 30); + final Picture circles2 = _drawTestPictureWithCircles(region, 90, 30); builder.addPicture(Offset.zero, circles2); builder.pop(); builder.pop(); @@ -64,21 +64,23 @@ void testMain() async { }); test('Background should only blur at ancestor clip boundary after move', () async { + final Rect region = Rect.fromLTWH(0, 0, 190, 130); + final SurfaceSceneBuilder builder = SurfaceSceneBuilder(); - final Picture backgroundPicture = _drawBackground(); + final Picture backgroundPicture = _drawBackground(region); builder.addPicture(Offset.zero, backgroundPicture); ClipRectEngineLayer clipEngineLayer = builder.pushClipRect( - const Rect.fromLTRB(10, 10, 300, 300), + const Rect.fromLTRB(10, 10, 180, 120), ); - final Picture circles1 = _drawTestPictureWithCircles(30, 30); + final Picture circles1 = _drawTestPictureWithCircles(region, 30, 30); builder.addPicture(Offset.zero, circles1); ClipRectEngineLayer clipEngineLayer2 = builder.pushClipRect( - const Rect.fromLTRB(60, 10, 300, 300), + const Rect.fromLTRB(60, 10, 180, 120), ); BackdropFilterEngineLayer oldBackdropFilterLayer = builder.pushBackdropFilter(ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0), oldLayer: null); - final Picture circles2 = _drawTestPictureWithCircles(90, 30); + final Picture circles2 = _drawTestPictureWithCircles(region, 90, 30); builder.addPicture(Offset.zero, circles2); builder.pop(); builder.pop(); @@ -89,12 +91,12 @@ void testMain() async { final SurfaceSceneBuilder builder2 = SurfaceSceneBuilder(); builder2.addPicture(Offset.zero, backgroundPicture); builder2.pushClipRect( - const Rect.fromLTRB(10, 10, 300, 300), + const Rect.fromLTRB(10, 10, 180, 120), oldLayer: clipEngineLayer ); builder2.addPicture(Offset.zero, circles1); builder2.pushClipRect( - const Rect.fromLTRB(10, 75, 300, 300), + const Rect.fromLTRB(10, 75, 180, 120), oldLayer: clipEngineLayer2 ); builder2.pushBackdropFilter(ImageFilter.blur(sigmaX: 10.0, sigmaY: 10.0), @@ -112,10 +114,10 @@ void testMain() async { }); } -Picture _drawTestPictureWithCircles(double offsetX, double offsetY) { +Picture _drawTestPictureWithCircles(Rect region, double offsetX, double offsetY) { final EnginePictureRecorder recorder = PictureRecorder(); final RecordingCanvas canvas = - recorder.beginRecording(const Rect.fromLTRB(0, 0, 400, 400)); + recorder.beginRecording(region); canvas.drawCircle( Offset(offsetX + 10, offsetY + 10), 10, Paint()..style = PaintingStyle.fill); canvas.drawCircle( @@ -139,12 +141,12 @@ Picture _drawTestPictureWithCircles(double offsetX, double offsetY) { return recorder.endRecording(); } -Picture _drawBackground() { +Picture _drawBackground(Rect region) { final EnginePictureRecorder recorder = PictureRecorder(); final RecordingCanvas canvas = - recorder.beginRecording(const Rect.fromLTRB(0, 0, 400, 400)); + recorder.beginRecording(region); canvas.drawRect( - Rect.fromLTWH(8, 8, 400.0 - 16, 400.0 - 16), + region.deflate(8.0), Paint() ..style = PaintingStyle.fill ..color = Color(0xFFE0FFE0) From edc6ac880d0a4643babe0fc578ec4dc235d2a7c7 Mon Sep 17 00:00:00 2001 From: Jim Graham Date: Thu, 3 Sep 2020 13:14:56 -0700 Subject: [PATCH 2/2] adjust goldens SHA to compare against --- lib/web_ui/dev/goldens_lock.yaml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/web_ui/dev/goldens_lock.yaml b/lib/web_ui/dev/goldens_lock.yaml index 30dc73592464f..0b8e6e25c74b5 100644 --- a/lib/web_ui/dev/goldens_lock.yaml +++ b/lib/web_ui/dev/goldens_lock.yaml @@ -1,2 +1,2 @@ repository: https://github.com/flutter/goldens.git -revision: 86a069d478c3512e4a91baa07ecb421156e10fce +revision: 57327a39aba333794a092d4e72777bb37102f8ba