From 12cd37901ded7ba643870ff790f92d6f1dff33a5 Mon Sep 17 00:00:00 2001 From: Jorge Coca Date: Sat, 30 Apr 2022 13:34:58 -0500 Subject: [PATCH] feat(pinball): added the footer widget with tests --- lib/footer/footer.dart | 77 ++++++++++++++ lib/l10n/arb/app_en.arb | 16 +++ packages/pinball_ui/lib/pinball_ui.dart | 4 + .../src/external_links/external_links.dart | 12 +++ packages/pinball_ui/pubspec.yaml | 3 +- .../external_links/external_links_test.dart | 82 ++++++++++++++ pubspec.lock | 58 +++++++++- test/footer/footer_test.dart | 100 ++++++++++++++++++ test/helpers/helpers.dart | 1 + test/helpers/mocks.dart | 6 ++ test/helpers/text_span.dart | 17 +++ 11 files changed, 374 insertions(+), 2 deletions(-) create mode 100644 lib/footer/footer.dart create mode 100644 packages/pinball_ui/lib/src/external_links/external_links.dart create mode 100644 packages/pinball_ui/test/src/external_links/external_links_test.dart create mode 100644 test/footer/footer_test.dart create mode 100644 test/helpers/text_span.dart diff --git a/lib/footer/footer.dart b/lib/footer/footer.dart new file mode 100644 index 00000000..a869d1d8 --- /dev/null +++ b/lib/footer/footer.dart @@ -0,0 +1,77 @@ +import 'package:flutter/gestures.dart'; +import 'package:flutter/material.dart'; +import 'package:pinball/l10n/l10n.dart'; +import 'package:pinball/theme/theme.dart'; +import 'package:pinball_ui/pinball_ui.dart'; + +/// {@template footer} +/// Footer widget with links to the main tech stack. +/// {@endtemplate} +class Footer extends StatelessWidget { + /// {@macro footer} + const Footer({Key? key}) : super(key: key); + + @override + Widget build(BuildContext context) { + return Padding( + padding: const EdgeInsets.fromLTRB(50, 0, 50, 32), + child: Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: const [ + _MadeWithFlutterAndFirebase(), + _GoogleIO(), + ], + ), + ); + } +} + +class _GoogleIO extends StatelessWidget { + const _GoogleIO({Key? key}) : super(key: key); + + @override + Widget build(BuildContext context) { + final l10n = context.l10n; + final theme = Theme.of(context); + return Text( + l10n.footerGoogleIOText, + style: theme.textTheme.bodyText1!.copyWith(color: AppColors.white), + ); + } +} + +class _MadeWithFlutterAndFirebase extends StatelessWidget { + const _MadeWithFlutterAndFirebase({Key? key}) : super(key: key); + + @override + Widget build(BuildContext context) { + final l10n = context.l10n; + final theme = Theme.of(context); + return RichText( + textAlign: TextAlign.center, + text: TextSpan( + text: l10n.footerMadeWithText, + style: theme.textTheme.bodyText1!.copyWith(color: AppColors.white), + children: [ + TextSpan( + text: l10n.footerMadeWithFlutterLinkText, + recognizer: TapGestureRecognizer() + ..onTap = () => openLink('https://flutter.dev'), + style: const TextStyle( + decoration: TextDecoration.underline, + ), + ), + const TextSpan(text: ' & '), + TextSpan( + text: l10n.footerMadeWithFirebaseLinkText, + recognizer: TapGestureRecognizer() + ..onTap = () => openLink('https://firebase.google.com'), + style: const TextStyle( + decoration: TextDecoration.underline, + ), + ), + ], + ), + ); + } +} diff --git a/lib/l10n/arb/app_en.arb b/lib/l10n/arb/app_en.arb index 19b12296..9540ba6d 100644 --- a/lib/l10n/arb/app_en.arb +++ b/lib/l10n/arb/app_en.arb @@ -107,5 +107,21 @@ "rounds": "Ball Ct:", "@rounds": { "description": "Text displayed on the scoreboard widget to indicate rounds left" + }, + "footerMadeWithText": "Made with ", + "@footerMadeWithText": { + "description": "Text shown on the footer which mentions technologies used to build the app." + }, + "footerMadeWithFlutterLinkText": "Flutter", + "@footerMadeWithFlutterLinkText": { + "description": "Text on the link shown on the footer which navigates to the Flutter page" + }, + "footerMadeWithFirebaseLinkText": "Firebase", + "@footerMadeWithFirebaseLinkText": { + "description": "Text on the link shown on the footer which navigates to the Firebase page" + }, + "footerGoogleIOText": "Google I/O", + "@footerGoogleIOText": { + "description": "Text shown on the footer which mentions Google I/O" } } \ No newline at end of file diff --git a/packages/pinball_ui/lib/pinball_ui.dart b/packages/pinball_ui/lib/pinball_ui.dart index b46adf95..6e139280 100644 --- a/packages/pinball_ui/lib/pinball_ui.dart +++ b/packages/pinball_ui/lib/pinball_ui.dart @@ -1,3 +1,7 @@ library pinball_ui; +export 'package:url_launcher/url_launcher.dart'; +export 'package:url_launcher_platform_interface/url_launcher_platform_interface.dart'; + export 'src/dialog/dialog.dart'; +export 'src/external_links/external_links.dart'; diff --git a/packages/pinball_ui/lib/src/external_links/external_links.dart b/packages/pinball_ui/lib/src/external_links/external_links.dart new file mode 100644 index 00000000..8e4792ea --- /dev/null +++ b/packages/pinball_ui/lib/src/external_links/external_links.dart @@ -0,0 +1,12 @@ +import 'package:flutter/foundation.dart'; +import 'package:url_launcher/url_launcher.dart'; + +/// Opens the given [url] in a new tab of the host browser +Future openLink(String url, {VoidCallback? onError}) async { + final uri = Uri.parse(url); + if (await canLaunchUrl(uri)) { + await launchUrl(uri); + } else if (onError != null) { + onError(); + } +} diff --git a/packages/pinball_ui/pubspec.yaml b/packages/pinball_ui/pubspec.yaml index 79c65338..60f32207 100644 --- a/packages/pinball_ui/pubspec.yaml +++ b/packages/pinball_ui/pubspec.yaml @@ -9,17 +9,18 @@ environment: dependencies: flutter: sdk: flutter + url_launcher: ^6.1.0 dev_dependencies: flutter_test: sdk: flutter + mocktail: ^0.3.0 test: ^1.19.2 very_good_analysis: ^2.4.0 flutter: uses-material-design: true generate: true - assets: - assets/images/dialog/ diff --git a/packages/pinball_ui/test/src/external_links/external_links_test.dart b/packages/pinball_ui/test/src/external_links/external_links_test.dart new file mode 100644 index 00000000..42edb180 --- /dev/null +++ b/packages/pinball_ui/test/src/external_links/external_links_test.dart @@ -0,0 +1,82 @@ +import 'package:flutter_test/flutter_test.dart'; +import 'package:mocktail/mocktail.dart'; +import 'package:pinball_ui/pinball_ui.dart'; +import 'package:plugin_platform_interface/plugin_platform_interface.dart'; +import 'package:url_launcher_platform_interface/url_launcher_platform_interface.dart'; + +class MockUrlLauncher extends Mock + with MockPlatformInterfaceMixin + implements UrlLauncherPlatform {} + +void main() { + late UrlLauncherPlatform urlLauncher; + + setUp(() { + urlLauncher = MockUrlLauncher(); + UrlLauncherPlatform.instance = urlLauncher; + }); + + group('openLink', () { + test('launches the link', () async { + when( + () => urlLauncher.canLaunch(any()), + ).thenAnswer( + (_) async => true, + ); + when( + () => urlLauncher.launch( + any(), + useSafariVC: any(named: 'useSafariVC'), + useWebView: any(named: 'useWebView'), + enableJavaScript: any(named: 'enableJavaScript'), + enableDomStorage: any(named: 'enableDomStorage'), + universalLinksOnly: any(named: 'universalLinksOnly'), + headers: any(named: 'headers'), + ), + ).thenAnswer( + (_) async => true, + ); + await openLink('uri'); + verify( + () => urlLauncher.launch( + any(), + useSafariVC: any(named: 'useSafariVC'), + useWebView: any(named: 'useWebView'), + enableJavaScript: any(named: 'enableJavaScript'), + enableDomStorage: any(named: 'enableDomStorage'), + universalLinksOnly: any(named: 'universalLinksOnly'), + headers: any(named: 'headers'), + ), + ); + }); + + test('executes the onError callback when it cannot launch', () async { + var wasCalled = false; + when( + () => urlLauncher.canLaunch(any()), + ).thenAnswer( + (_) async => false, + ); + when( + () => urlLauncher.launch( + any(), + useSafariVC: any(named: 'useSafariVC'), + useWebView: any(named: 'useWebView'), + enableJavaScript: any(named: 'enableJavaScript'), + enableDomStorage: any(named: 'enableDomStorage'), + universalLinksOnly: any(named: 'universalLinksOnly'), + headers: any(named: 'headers'), + ), + ).thenAnswer( + (_) async => true, + ); + await openLink( + 'url', + onError: () { + wasCalled = true; + }, + ); + await expectLater(wasCalled, isTrue); + }); + }); +} diff --git a/pubspec.lock b/pubspec.lock index 3b6d5d63..3e73f15f 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -700,6 +700,62 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "1.3.0" + url_launcher: + dependency: transitive + description: + name: url_launcher + url: "https://pub.dartlang.org" + source: hosted + version: "6.1.0" + url_launcher_android: + dependency: transitive + description: + name: url_launcher_android + url: "https://pub.dartlang.org" + source: hosted + version: "6.0.16" + url_launcher_ios: + dependency: transitive + description: + name: url_launcher_ios + url: "https://pub.dartlang.org" + source: hosted + version: "6.0.15" + url_launcher_linux: + dependency: transitive + description: + name: url_launcher_linux + url: "https://pub.dartlang.org" + source: hosted + version: "3.0.0" + url_launcher_macos: + dependency: transitive + description: + name: url_launcher_macos + url: "https://pub.dartlang.org" + source: hosted + version: "3.0.0" + url_launcher_platform_interface: + dependency: transitive + description: + name: url_launcher_platform_interface + url: "https://pub.dartlang.org" + source: hosted + version: "2.0.5" + url_launcher_web: + dependency: transitive + description: + name: url_launcher_web + url: "https://pub.dartlang.org" + source: hosted + version: "2.0.9" + url_launcher_windows: + dependency: transitive + description: + name: url_launcher_windows + url: "https://pub.dartlang.org" + source: hosted + version: "3.0.0" uuid: dependency: transitive description: @@ -772,4 +828,4 @@ packages: version: "3.1.0" sdks: dart: ">=2.16.0 <3.0.0" - flutter: ">=2.8.0" + flutter: ">=2.10.0" diff --git a/test/footer/footer_test.dart b/test/footer/footer_test.dart new file mode 100644 index 00000000..c18d76e7 --- /dev/null +++ b/test/footer/footer_test.dart @@ -0,0 +1,100 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_test/flutter_test.dart'; +import 'package:mocktail/mocktail.dart'; +import 'package:pinball/footer/footer.dart'; +import 'package:pinball_ui/pinball_ui.dart'; + +import '../helpers/helpers.dart'; + +void main() { + group('Footer', () { + late UrlLauncherPlatform urlLauncher; + + setUp(() async { + urlLauncher = MockUrlLauncher(); + UrlLauncherPlatform.instance = urlLauncher; + }); + testWidgets('renders "Made with..." and "Google I/O"', (tester) async { + await tester.pumpApp(const Footer()); + expect(find.text('Google I/O'), findsOneWidget); + expect( + find.byWidgetPredicate( + (widget) => + widget is RichText && + widget.text.toPlainText() == 'Made with Flutter & Firebase', + ), + findsOneWidget, + ); + }); + + testWidgets( + 'tapping on "Flutter" opens the flutter website', + (tester) async { + when(() => urlLauncher.canLaunch(any())).thenAnswer((_) async => true); + when( + () => urlLauncher.launch( + any(), + useSafariVC: any(named: 'useSafariVC'), + useWebView: any(named: 'useWebView'), + enableJavaScript: any(named: 'enableJavaScript'), + enableDomStorage: any(named: 'enableDomStorage'), + universalLinksOnly: any(named: 'universalLinksOnly'), + headers: any(named: 'headers'), + ), + ).thenAnswer((_) async => true); + await tester.pumpApp(const Footer()); + final flutterTextFinder = find.byWidgetPredicate( + (widget) => widget is RichText && tapTextSpan(widget, 'Flutter'), + ); + await tester.tap(flutterTextFinder); + await tester.pumpAndSettle(); + verify( + () => urlLauncher.launch( + 'https://flutter.dev', + useSafariVC: any(named: 'useSafariVC'), + useWebView: any(named: 'useWebView'), + enableJavaScript: any(named: 'enableJavaScript'), + enableDomStorage: any(named: 'enableDomStorage'), + universalLinksOnly: any(named: 'universalLinksOnly'), + headers: any(named: 'headers'), + ), + ); + }, + ); + + testWidgets( + 'tapping on "Firebase" opens the firebase website', + (tester) async { + when(() => urlLauncher.canLaunch(any())).thenAnswer((_) async => true); + when( + () => urlLauncher.launch( + any(), + useSafariVC: any(named: 'useSafariVC'), + useWebView: any(named: 'useWebView'), + enableJavaScript: any(named: 'enableJavaScript'), + enableDomStorage: any(named: 'enableDomStorage'), + universalLinksOnly: any(named: 'universalLinksOnly'), + headers: any(named: 'headers'), + ), + ).thenAnswer((_) async => true); + await tester.pumpApp(const Footer()); + final firebaseTextFinder = find.byWidgetPredicate( + (widget) => widget is RichText && tapTextSpan(widget, 'Firebase'), + ); + await tester.tap(firebaseTextFinder); + await tester.pumpAndSettle(); + verify( + () => urlLauncher.launch( + 'https://firebase.google.com', + useSafariVC: any(named: 'useSafariVC'), + useWebView: any(named: 'useWebView'), + enableJavaScript: any(named: 'enableJavaScript'), + enableDomStorage: any(named: 'enableDomStorage'), + universalLinksOnly: any(named: 'universalLinksOnly'), + headers: any(named: 'headers'), + ), + ); + }, + ); + }); +} diff --git a/test/helpers/helpers.dart b/test/helpers/helpers.dart index 8732035a..58b4b126 100644 --- a/test/helpers/helpers.dart +++ b/test/helpers/helpers.dart @@ -12,3 +12,4 @@ export 'mocks.dart'; export 'navigator.dart'; export 'pump_app.dart'; export 'test_games.dart'; +export 'text_span.dart'; diff --git a/test/helpers/mocks.dart b/test/helpers/mocks.dart index 1578c3e0..b56c068d 100644 --- a/test/helpers/mocks.dart +++ b/test/helpers/mocks.dart @@ -11,6 +11,8 @@ import 'package:pinball/select_character/select_character.dart'; import 'package:pinball/start_game/start_game.dart'; import 'package:pinball_audio/pinball_audio.dart'; import 'package:pinball_components/pinball_components.dart'; +import 'package:pinball_ui/pinball_ui.dart'; +import 'package:plugin_platform_interface/plugin_platform_interface.dart'; class MockPinballGame extends Mock implements PinballGame {} @@ -94,3 +96,7 @@ class MockMultiplier extends Mock implements Multiplier {} class MockMultipliersGroup extends Mock implements Multipliers {} class MockMultiplierCubit extends Mock implements MultiplierCubit {} + +class MockUrlLauncher extends Mock + with MockPlatformInterfaceMixin + implements UrlLauncherPlatform {} diff --git a/test/helpers/text_span.dart b/test/helpers/text_span.dart new file mode 100644 index 00000000..c98d33d9 --- /dev/null +++ b/test/helpers/text_span.dart @@ -0,0 +1,17 @@ +import 'package:flutter/gestures.dart'; +import 'package:flutter/widgets.dart'; + +bool tapTextSpan(RichText richText, String text) { + final isTapped = !richText.text.visitChildren( + (visitor) => _findTextAndTap(visitor, text), + ); + return isTapped; +} + +bool _findTextAndTap(InlineSpan visitor, String text) { + if (visitor is TextSpan && visitor.text == text) { + (visitor.recognizer as TapGestureRecognizer?)?.onTap?.call(); + return false; + } + return true; +}