|
| 1 | +// Copyright 2013 The Flutter Authors. All rights reserved. |
| 2 | +// Use of this source code is governed by a BSD-style license that can be |
| 3 | +// found in the LICENSE file. |
| 4 | + |
| 5 | +import 'dart:html' as html; |
| 6 | + |
| 7 | +import 'package:ui/ui.dart' hide TextStyle; |
| 8 | +import 'package:ui/src/engine.dart'; |
| 9 | +import 'package:test/test.dart'; |
| 10 | + |
| 11 | +import 'package:web_engine_tester/golden_tester.dart'; |
| 12 | + |
| 13 | +void main() async { |
| 14 | + const double screenWidth = 600.0; |
| 15 | + const double screenHeight = 800.0; |
| 16 | + const Rect screenRect = Rect.fromLTWH(0, 0, screenWidth, screenHeight); |
| 17 | + |
| 18 | + // Commit a recording canvas to a bitmap, and compare with the expected |
| 19 | + Future<void> _checkScreenshot(RecordingCanvas rc, String fileName, |
| 20 | + {Rect region = const Rect.fromLTWH(0, 0, 500, 500), |
| 21 | + bool write = false}) async { |
| 22 | + final EngineCanvas engineCanvas = BitmapCanvas(screenRect); |
| 23 | + rc.apply(engineCanvas); |
| 24 | + |
| 25 | + // Wrap in <flt-scene> so that our CSS selectors kick in. |
| 26 | + final html.Element sceneElement = html.Element.tag('flt-scene'); |
| 27 | + try { |
| 28 | + sceneElement.append(engineCanvas.rootElement); |
| 29 | + html.document.body.append(sceneElement); |
| 30 | + await matchGoldenFile('$fileName.png', region: region); |
| 31 | + } finally { |
| 32 | + // The page is reused across tests, so remove the element after taking the |
| 33 | + // golden screenshot. |
| 34 | + sceneElement.remove(); |
| 35 | + } |
| 36 | + } |
| 37 | + |
| 38 | + setUp(() async { |
| 39 | + debugEmulateFlutterTesterEnvironment = true; |
| 40 | + await webOnlyInitializePlatform(); |
| 41 | + webOnlyFontCollection.debugRegisterTestFonts(); |
| 42 | + await webOnlyFontCollection.ensureFontsLoaded(); |
| 43 | + }); |
| 44 | + |
| 45 | + test('Should draw linear gradient using rectangle.', () async { |
| 46 | + final RecordingCanvas rc = |
| 47 | + RecordingCanvas(const Rect.fromLTRB(0, 0, 500, 500)); |
| 48 | + Rect shaderRect = const Rect.fromLTRB(50, 50, 300, 300); |
| 49 | + final Paint paint = Paint()..shader = Gradient.linear( |
| 50 | + Offset(shaderRect.left, shaderRect.top), |
| 51 | + Offset(shaderRect.right, shaderRect.bottom), |
| 52 | + [Color(0xFFcfdfd2), Color(0xFF042a85)]); |
| 53 | + rc.drawRect(shaderRect, paint); |
| 54 | + expect(rc.hasArbitraryPaint, isTrue); |
| 55 | + await _checkScreenshot(rc, 'linear_gradient_rect'); |
| 56 | + }); |
| 57 | + |
| 58 | + // Regression test for https://github.com/flutter/flutter/issues/50010 |
| 59 | + test('Should draw linear gradient using rounded rect.', () async { |
| 60 | + final RecordingCanvas rc = |
| 61 | + RecordingCanvas(const Rect.fromLTRB(0, 0, 500, 500)); |
| 62 | + Rect shaderRect = const Rect.fromLTRB(50, 50, 300, 300); |
| 63 | + final Paint paint = Paint()..shader = Gradient.linear( |
| 64 | + Offset(shaderRect.left, shaderRect.top), |
| 65 | + Offset(shaderRect.right, shaderRect.bottom), |
| 66 | + [Color(0xFFcfdfd2), Color(0xFF042a85)]); |
| 67 | + rc.drawRRect(RRect.fromRectAndRadius(shaderRect, Radius.circular(16)), paint); |
| 68 | + expect(rc.hasArbitraryPaint, isTrue); |
| 69 | + await _checkScreenshot(rc, 'linear_gradient_rounded_rect'); |
| 70 | + }); |
| 71 | +} |
0 commit comments