Flutter Integration Test not working with Dialog

Question

I am writing tests for our company's app.

I am testing the login screen which has 2 simple TextFields, and a Button. We fail the test by entering wrong credentials. Then a ErrorDialog shows up (Custom widget). The ErrorDialog shows a simple error message and has a button with "Done". When I try to close the widget by clicking Done, nothing happens. It seems like the test can't find the widget. But when I press on the Done button, Flutter does give me suggestions for my tap action. But all of the suggested solutions don't work. Does someone know what I am doing wrong?

import 'package:**/app/main.dart' as app;
import 'package:common/presentation/generic/widgets/buttons/borderless_button.dart';
import 'package:common/presentation/generic/widgets/buttons/**_blue_button.dart';
import 'package:flutter/material.dart';
import 'package:flutter_test/flutter_test.dart';
import 'package:integration_test/integration_test.dart';

void main() {
  IntegrationTestWidgetsFlutterBinding.ensureInitialized();

  group('login page end-to-end tests', () {
    testWidgets(
        'STEP 1: Tap on login from splashscreen and fill in the login credentials. \n'
        'STEP 2: Tap on the login button in order to attempt authentication with an invalid email adress. \n'
        'STEP 3: Press done button when invalid email is entered. \n'
        'STEP 4: Enter valid credentials. '
        'STEP 5: Tap on login button in order to authenticate with valid password and email \n',
        (tester) async {
      app.main();
      await tester.pumpAndSettle();

      final loginButton = find.byType(BorderlessButton).first;
      await tester.tap(loginButton);
      await tester.pumpAndSettle();

      final userNameField = find.byType(TextFormField).first;
      final passwordField = find.byType(TextFormField).last;
      final submitButton = find.byType(CoinmerceBlueButton).first;

      await tester.enterText(userNameField, 'x');
      await tester.enterText(passwordField, 'x');
      await tester.pumpAndSettle();

      await tester.tap(submitButton);
      await tester.pumpAndSettle();

      final doneButton = find.byKey(const ValueKey("errorDialog"));
      await tester.tap(doneButton);
      await tester.pumpAndSettle();

      expect(
        find.text('Dit lijkt geen geldig e-mailadres te zijn.'),
        findsOneWidget,
      );
    });
  });
}

My widget tree:

Thanks in advance!

score 0 · Answer 1 · answered Jun 16 '23 at 05:16

I had the exact same problem and it was from using await when displaying the dialog box. Essentially the 'pumpAndSettle' waits for all Futures to be returned and the dialog doesn't finish until the 'Close' button is pushed. Therefore the test is awaiting for the dialog to close before it can push the close button.

Flutter Integration Test not working with Dialog

1 Answers1