import 'dart:async'; import 'package:flutter/material.dart'; import 'package:flutter_test/flutter_test.dart'; import 'package:provider/provider.dart'; import 'package:shared_preferences_platform_interface/in_memory_shared_preferences_async.dart'; import 'package:shared_preferences_platform_interface/shared_preferences_async_platform_interface.dart'; import 'package:fruitshorts/core/data/models/auth_session.dart'; import 'package:fruitshorts/core/data/remote/api_client.dart'; import 'package:fruitshorts/core/data/remote/auth_api.dart'; import 'package:fruitshorts/core/data/services/auth_controller.dart'; import 'package:fruitshorts/core/data/services/auth_session_store.dart'; import 'package:fruitshorts/core/platform/haptics.dart'; import 'package:fruitshorts/core/theme/app_colors.dart'; import 'package:fruitshorts/core/theme/app_dimens.dart'; import 'package:fruitshorts/l10n/app_localizations.dart'; import 'package:fruitshorts/pages/auth/auth_view.dart'; import '../support/fake_haptics.dart'; import '../support/fake_http_adapter.dart'; void main() { setUp(() { SharedPreferencesAsyncPlatform.instance = InMemorySharedPreferencesAsync.empty(); }); Future pumpAuthPage( WidgetTester tester, { AuthApi? api, FakeHaptics? haptics, bool openEmail = true, bool asRoute = false, }) async { final auth = AuthController( api ?? AuthApi( ApiClient( baseUrl: 'http://127.0.0.1:1', adapter: FakeHttpAdapter( (_) async => FakeHttpResponse('{}', 500), ), ), ), AuthSessionStore(), ); await tester.pumpWidget( MultiProvider( providers: [ ChangeNotifierProvider.value(value: auth), Provider.value(value: haptics ?? FakeHaptics()), ], child: MaterialApp( locale: const Locale('en'), localizationsDelegates: AppLocalizations.localizationsDelegates, supportedLocales: AppLocalizations.supportedLocales, home: asRoute ? const _AuthRouteHost() : const AuthPage(), ), ), ); await tester.pump(const Duration(milliseconds: 220)); if (asRoute) { await tester.tap(find.byKey(const Key('auth-open'))); await tester.pumpAndSettle(); } if (openEmail) { await tester.ensureVisible(find.byKey(const Key('auth-entry-email'))); await tester.tap(find.byKey(const Key('auth-entry-email'))); await tester.pumpAndSettle(); } } testWidgets( 'should_render_branded_dark_layout_with_approved_tokens_when_page_opens', (tester) async { await pumpAuthPage(tester, openEmail: false); expect(find.byKey(const Key('auth-landing')), findsOneWidget); expect(find.text('FruitShorts'), findsOneWidget); expect( find.text('Sign in to sync progress, favorites and coins'), findsOneWidget, ); expect( tester.getSize(find.byKey(const Key('auth-brand-logo'))), const Size(72, 72), ); expect(find.byKey(const Key('auth-entry-google')), findsNothing); expect(find.byKey(const Key('auth-entry-phone')), findsOneWidget); expect(find.byKey(const Key('auth-entry-email')), findsOneWidget); expect(find.byKey(const Key('auth-legal')), findsOneWidget); expect( tester.getSize(find.byKey(const Key('auth-entry-phone'))).height, 50, ); expect( tester.getSize(find.byKey(const Key('auth-entry-email'))).height, 50, ); final phoneButton = tester.widget( find.descendant( of: find.byKey(const Key('auth-entry-phone')), matching: find.byType(Material), ), ); expect(phoneButton.color, AppColors.blue); final emailButton = tester.widget( find.descendant( of: find.byKey(const Key('auth-entry-email')), matching: find.byType(Material), ), ); expect(emailButton.color, AppColors.card); expect( (emailButton.shape! as RoundedRectangleBorder).side.color, AppColors.border, ); final glow = tester.widget( find.byKey(const Key('auth-background-glow')), ); final glowDecoration = glow.decoration! as BoxDecoration; final gradient = glowDecoration.gradient! as RadialGradient; expect(gradient.colors.first, AppColors.surfaceTop); expect(gradient.colors.last.a, 0); await tester.tap(find.byKey(const Key('auth-entry-email'))); await tester.pumpAndSettle(); final card = tester.widget(find.byKey(const Key('auth-card'))); final cardDecoration = card.decoration! as BoxDecoration; expect(cardDecoration.color, AppColors.card); expect( cardDecoration.borderRadius, BorderRadius.circular(AppDimens.authCardRadius), ); expect(cardDecoration.boxShadow, isNull); expect(card.padding, const EdgeInsets.all(20)); final email = tester.widget( find.byKey(const Key('auth-email')), ); expect(email.decoration?.fillColor, AppColors.card); expect(email.style?.color, AppColors.onSurface); expect(email.style?.fontSize, 15); expect(email.cursorColor, AppColors.blue); expect(tester.getSize(find.byKey(const Key('auth-email'))).height, 52); final emailBorder = email.decoration!.enabledBorder! as OutlineInputBorder; expect(emailBorder.borderRadius, BorderRadius.circular(14)); expect(emailBorder.borderSide.color, AppColors.border); expect(emailBorder.borderSide.width, 1); final password = tester.widget( find.byKey(const Key('auth-password')), ); expect(password.style?.color, AppColors.onSurface); expect(password.style?.fontSize, 15); expect(password.cursorColor, AppColors.blue); final submit = tester.widget( find.byKey(const Key('auth-submit')), ); expect(submit.style!.backgroundColor!.resolve(const {}), AppColors.blue); expect( submit.style!.backgroundColor!.resolve(const {WidgetState.pressed}), AppColors.bluePressed, ); expect(tester.getSize(find.byKey(const Key('auth-submit'))).height, 50); expect( (submit.style!.shape!.resolve(const {})! as RoundedRectangleBorder) .borderRadius, BorderRadius.circular(25), ); expect(find.text('Sign In'), findsWidgets); expect(find.text('Sign Up'), findsOneWidget); expect( tester.widget(find.text('Sign In').first).style?.fontSize, isNot(0), ); }, ); testWidgets( 'should_show_app_logo_lower_on_the_page_when_landing_opens', (tester) async { tester.view.physicalSize = const Size(390, 844); tester.view.devicePixelRatio = 1; addTearDown(tester.view.resetPhysicalSize); addTearDown(tester.view.resetDevicePixelRatio); await pumpAuthPage(tester, openEmail: false); final image = tester.widget( find.descendant( of: find.byKey(const Key('auth-brand-logo')), matching: find.byType(Image), ), ); expect( (image.image as AssetImage).assetName, 'assets/icon/fruitshorts.png', ); expect( tester.getTopLeft(find.byKey(const Key('auth-brand-logo'))).dy, 84, ); }, ); testWidgets('should_render_40px_back_button_when_page_is_pushed', ( tester, ) async { await pumpAuthPage(tester, openEmail: false, asRoute: true); final back = find.byKey(const Key('auth-back')); expect(tester.getSize(back), const Size(40, 40)); expect( tester .widget( find.descendant(of: back, matching: find.byType(Material)), ) .color, AppColors.transparent, ); }); testWidgets('should_fade_and_slide_content_in_within_220ms', (tester) async { await pumpAuthPage(tester); final animation = tester.widget>( find.byKey(const Key('auth-enter-animation')), ); expect( animation.duration, lessThanOrEqualTo(const Duration(milliseconds: 220)), ); expect(animation.tween.begin, 0); expect(animation.tween.end, 1); }); testWidgets( 'should_switch_between_sign_in_and_sign_up_when_segment_is_tapped', (tester) async { await pumpAuthPage(tester); expect(find.text('Welcome back'), findsOneWidget); await tester.tap(find.byKey(const Key('auth-mode-sign-up'))); await tester.pumpAndSettle(); expect(find.text('Create your account'), findsOneWidget); expect(find.text('Welcome back'), findsNothing); expect(_segmentColor(tester, 'auth-mode-sign-up'), AppColors.blue); expect(_segmentColor(tester, 'auth-mode-sign-in'), Colors.transparent); await tester.tap(find.byKey(const Key('auth-mode-sign-in'))); await tester.pumpAndSettle(); expect(find.text('Welcome back'), findsOneWidget); expect(find.text('Create your account'), findsNothing); expect(_segmentColor(tester, 'auth-mode-sign-in'), AppColors.blue); expect(_segmentColor(tester, 'auth-mode-sign-up'), Colors.transparent); }, ); testWidgets( 'should_move_focus_and_toggle_password_when_auth_controls_are_used', (tester) async { await pumpAuthPage(tester); await tester.tap(find.byKey(const Key('auth-email'))); await tester.testTextInput.receiveAction(TextInputAction.next); await tester.pump(); expect( FocusManager.instance.primaryFocus?.debugLabel, 'auth-password-focus', ); await tester.tap(find.byKey(const Key('auth-email'))); await tester.pump(); final email = tester.widget( find.byKey(const Key('auth-email')), ); final focusedBorder = email.decoration!.focusedBorder! as OutlineInputBorder; expect(focusedBorder.borderSide.color, AppColors.blue); expect(focusedBorder.borderSide.width, 1); expect( tester.widget(find.byIcon(Icons.mail_outline_rounded)).color, AppColors.blue, ); await tester.tap(find.byKey(const Key('auth-password-visibility'))); await tester.pump(); expect( tester .widget(find.byKey(const Key('auth-password'))) .obscureText, isFalse, ); expect(find.byTooltip('Hide password'), findsOneWidget); }, ); testWidgets( 'should_disable_form_mode_switch_and_submit_when_sign_in_is_pending', (tester) async { final api = _PendingAuthApi(); final haptics = FakeHaptics(); await pumpAuthPage(tester, api: api, haptics: haptics); await tester.enterText(find.byKey(const Key('auth-email')), 'a@b.com'); await tester.enterText( find.byKey(const Key('auth-password')), 'abcd1234', ); await tester.tap(find.byKey(const Key('auth-submit'))); await tester.pump(); expect(api.loginCalls, 1); expect(haptics.lightImpacts, 1); expect( tester.widget(find.byKey(const Key('auth-email'))).enabled, isFalse, ); expect( tester .widget(find.byKey(const Key('auth-password'))) .enabled, isFalse, ); expect( tester .widget(find.byKey(const Key('auth-switch-mode'))) .onPressed, isNull, ); expect( tester .widget(find.byKey(const Key('auth-submit'))) .onPressed, isNull, ); api.release(); await tester.pumpAndSettle(); }, ); testWidgets('should_show_validation_message_inside_semantic_error_capsule', ( tester, ) async { await pumpAuthPage(tester); await tester.enterText(find.byKey(const Key('auth-email')), 'a@b.com'); await tester.enterText(find.byKey(const Key('auth-password')), 'abcdefgh'); await tester.tap(find.byKey(const Key('auth-submit'))); await tester.pumpAndSettle(); final capsuleFinder = find.byKey(const Key('auth-error-capsule')); expect(capsuleFinder, findsOneWidget); final capsule = tester.widget(capsuleFinder); final decoration = capsule.decoration! as BoxDecoration; expect(decoration.borderRadius, BorderRadius.circular(12)); expect(decoration.color?.a, closeTo(0.1, 0.001)); final errorFinder = find.byKey(const Key('auth-error')); final error = tester.widget(errorFinder); final scheme = Theme.of(tester.element(errorFinder)).colorScheme; expect(error.style?.color, scheme.error); expect(error.style?.fontSize, 12); expect( find.descendant( of: capsuleFinder, matching: find.byIcon(Icons.error_outline_rounded), ), findsOneWidget, ); }); } Color? _segmentColor(WidgetTester tester, String key) { final segment = find.byKey(Key(key)); final animated = tester.widget( find.descendant(of: segment, matching: find.byType(AnimatedContainer)), ); return (animated.decoration! as BoxDecoration).color; } class _PendingAuthApi extends AuthApi { _PendingAuthApi() : super( ApiClient( baseUrl: 'http://127.0.0.1:1', adapter: FakeHttpAdapter((_) async => FakeHttpResponse('{}', 500)), ), ); final _gate = Completer(); int loginCalls = 0; void release() => _gate.complete(); @override Future login({ required String email, required String password, required String deviceId, String platform = '', String osVersion = '', String appVersion = '', }) async { loginCalls++; await _gate.future; throw const ApiException(500, 'pending failure'); } } class _AuthRouteHost extends StatelessWidget { const _AuthRouteHost(); @override Widget build(BuildContext context) { return Scaffold( body: Center( child: TextButton( key: const Key('auth-open'), onPressed: () => Navigator.of( context, ).push(MaterialPageRoute(builder: (_) => const AuthPage())), child: const Text('Open auth'), ), ), ); } }