Integration testing in Flutter - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ ui_behavior

intermediate

What is the output of this Flutter integration test snippet?

Consider this Flutter integration test code that taps a button and expects a text change. What will the test find after tapping the button?

Flutter

testWidgets('Button tap changes text', (WidgetTester tester) async {
  await tester.pumpWidget(MaterialApp(home: Scaffold(body: StatefulBuilder(
    builder: (context, setState) {
      String text = 'Before';
      return Column(children: [
        Text(text, key: Key('displayText')),
        ElevatedButton(
          onPressed: () => setState(() => text = 'After'),
          child: Text('Tap me'),
        ),
      ]);
    },
  )));
  expect(find.text('Before'), findsOneWidget);
  await tester.tap(find.byType(ElevatedButton));
  await tester.pump();
  expect(find.text('After'), findsOneWidget);
});

A The test fails because the text never changes from 'Before'.

B The test fails because the button is not found.

C The test throws a runtime error due to setState used incorrectly.

D The test passes because the text changes from 'Before' to 'After' after tapping.

💡 Hint

Remember how StatefulBuilder works and when the state variable is reset.

The variable 'text' is reinitialized to 'Before' every build, so setState changes a local variable that resets immediately. The text never updates to 'After'.

❓ lifecycle

intermediate

Which lifecycle method is best to initialize integration test bindings in Flutter?

In Flutter integration tests, which method should you call to ensure the test environment is ready before running tests?

A setUp() with runApp()

B tearDownAll() with runApp()

C tearDown() with IntegrationTestWidgetsFlutterBinding.ensureInitialized()

D setUpAll() with IntegrationTestWidgetsFlutterBinding.ensureInitialized()

💡 Hint

Initialization should happen once before all tests.

IntegrationTestWidgetsFlutterBinding.ensureInitialized() should be called inside setUpAll() to prepare the test environment once before all tests run.

🔧 Debug

advanced

What error does this integration test produce?

This Flutter integration test tries to find a widget by key but fails. What error will it raise?

Flutter

testWidgets('Find widget by key', (WidgetTester tester) async {
  await tester.pumpWidget(MaterialApp(home: Text('Hello')));
  expect(find.byKey(Key('missingKey')), findsOneWidget);
});

A TestFailure: Expected to find one matching node in the widget tree but found none.

B NoSuchMethodError: The method 'byKey' was called on null.

C TimeoutException: Widget not found within time limit.

D SyntaxError: Missing semicolon.

💡 Hint

Check what happens when find.byKey does not find any widget.

The test expects to find one widget with the key 'missingKey' but none exists, so it throws a TestFailure.

❓ navigation

advanced

What is the final screen shown after this integration test navigation?

Given this Flutter integration test code that taps a button to navigate, which screen is visible at the end?

Flutter

testWidgets('Navigate to second screen', (WidgetTester tester) async {
  await tester.pumpWidget(MaterialApp(
    home: Scaffold(
      body: Builder(builder: (context) {
        return ElevatedButton(
          onPressed: () => Navigator.push(context, MaterialPageRoute(builder: (_) => Scaffold(body: Center(child: Text('Second Screen'))))),
          child: Text('Go'),
        );
      }),
    ),
  ));
  await tester.tap(find.text('Go'));
  await tester.pumpAndSettle();
  expect(find.text('Second Screen'), findsOneWidget);
});

A The screen still shows the button labeled 'Go'.

B The screen shows the text 'Second Screen'.

C The test fails because Navigator.push is not awaited.

D The test throws an exception due to missing MaterialApp.

💡 Hint

pumpAndSettle waits for navigation animations to finish.

After tapping the button, Navigator.push navigates to a new screen showing 'Second Screen'. pumpAndSettle waits for the transition to complete.

🧠 Conceptual

expert

Which statement about Flutter integration testing is true?

Choose the correct statement about Flutter integration tests compared to widget tests.

A Integration tests do not support asynchronous operations and must be synchronous.

B Integration tests only test individual widgets in isolation without platform dependencies.

C Integration tests run on real devices or emulators and test the full app including platform channels.

D Integration tests cannot simulate user gestures like taps or scrolls.

💡 Hint

Think about the scope and environment of integration tests.

Integration tests run on real devices or emulators and test the entire app including platform-specific features, unlike widget tests which are more isolated.

Practice

1. What is the main purpose of integration testing in Flutter apps?

easy

A. To test individual functions for correctness

B. To check the app's UI design colors

C. To measure app performance under load

D. To check if different parts of the app work together correctly

Solution

1. Step 1: Understand integration testing goal

   Integration testing focuses on how different parts of the app interact and work together.

2. Step 2: Compare with other test types

   Unit tests check individual functions, performance tests check speed, and UI design tests check visuals.

3. Final Answer:

   To check if different parts of the app work together correctly -> Option D

4. Quick Check:

   Integration testing = check parts working together [OK]

Hint: Integration tests check combined parts, not single functions [OK]

Common Mistakes:

• Confusing integration testing with unit testing
• Thinking it tests only UI colors
• Mixing it up with performance testing

2. Which line correctly initializes integration testing in a Flutter test file?

easy

A. IntegrationTestWidgetsFlutterBinding.ensureInitialized();

B. WidgetsFlutterBinding.ensureInitialized();

C. IntegrationTestBinding.initialize();

D. TestWidgetsBinding.ensureInitialized();

Solution

1. Step 1: Identify the correct binding for integration tests

   The official Flutter integration test package uses IntegrationTestWidgetsFlutterBinding.ensureInitialized() to set up.

2. Step 2: Check other options for correctness

   WidgetsFlutterBinding is for widget tests, not integration tests. Others are incorrect or do not exist.

3. Final Answer:

   IntegrationTestWidgetsFlutterBinding.ensureInitialized(); -> Option A

4. Quick Check:

   Use IntegrationTestWidgetsFlutterBinding for integration tests [OK]

Hint: Use IntegrationTestWidgetsFlutterBinding.ensureInitialized() for integration tests [OK]

Common Mistakes:

• Using WidgetsFlutterBinding instead of IntegrationTestWidgetsFlutterBinding
• Misspelling the method name
• Trying to call a non-existent initialize() method

3. Given this integration test snippet, what will the test check?

final button = find.text('Tap me');
await tester.tap(button);
await tester.pumpAndSettle();
expect(find.text('Tapped!'), findsOneWidget);

medium

A. The test checks if the button is disabled

B. The button labeled 'Tapped!' is tapped and text changes to 'Tap me'

C. The button labeled 'Tap me' is tapped and text changes to 'Tapped!'

D. The test waits but does not tap any button

Solution

1. Step 1: Analyze the tap action

   The test finds a button with text 'Tap me' and taps it.

2. Step 2: Check the expected result

   After tapping and waiting for animations, it expects to find text 'Tapped!' on screen.

3. Final Answer:

   The button labeled 'Tap me' is tapped and text changes to 'Tapped!' -> Option C

4. Quick Check:

   Tap 'Tap me' button, expect 'Tapped!' text [OK]

Hint: Look for tap target text and expected text after tap [OK]

Common Mistakes:

• Confusing which text is tapped and which is expected
• Ignoring await pumpAndSettle() for UI update
• Assuming no tap happens

4. What is wrong with this integration test code snippet?

void main() {
  testWidgets('tap test', (tester) async {
    final binding = IntegrationTestWidgetsFlutterBinding.ensureInitialized();
    final button = find.text('Click');
    await tester.tap(button);
    expect(find.text('Clicked'), findsOneWidget);
  });
}

medium

A. Binding initialization should be outside testWidgets, in main() before tests

B. The find.text selector is incorrect syntax

C. Missing await before tester.tap

D. expect should be called before tap

Solution

1. Step 1: Check binding initialization placement

   IntegrationTestWidgetsFlutterBinding.ensureInitialized() should be called once before all tests, not inside testWidgets.

2. Step 2: Verify other code parts

   find.text syntax is correct, await is used before tap, and expect is correctly after tap.

3. Final Answer:

   Binding initialization should be outside testWidgets, in main() before tests -> Option A

4. Quick Check:

   Initialize binding once before tests [OK]

Hint: Initialize binding once before tests, not inside each test [OK]

Common Mistakes:

• Calling ensureInitialized inside each testWidgets
• Forgetting await before tap
• Misordering expect before tap

5. You want to write an integration test that types 'hello' into a TextField and then taps a button labeled 'Send'. Which sequence correctly performs this in Flutter integration tests?

hard

A. await tester.tap(find.text('Send')); await tester.enterText(find.byType(TextField), 'hello'); await tester.pump();

B. await tester.enterText(find.byType(TextField), 'hello'); await tester.tap(find.text('Send')); await tester.pumpAndSettle();

C. await tester.enterText(find.text('Send'), 'hello'); await tester.tap(find.byType(TextField)); await tester.pumpAndSettle();

D. await tester.tap(find.byType(TextField)); await tester.enterText(find.text('Send'), 'hello'); await tester.pump();

Solution

1. Step 1: Enter text into the TextField

   Use tester.enterText with find.byType(TextField) to type 'hello'.

2. Step 2: Tap the 'Send' button and wait for UI update

   Tap the button found by text 'Send' and call pumpAndSettle() to wait for animations.

3. Final Answer:

   await tester.enterText(find.byType(TextField), 'hello'); await tester.tap(find.text('Send')); await tester.pumpAndSettle(); -> Option B

4. Quick Check:

   Type first, then tap button, then wait [OK]

Hint: Type text first, then tap button, then wait for UI [OK]

Common Mistakes:

• Tapping button before typing text
• Using wrong finder for TextField or button
• Not waiting with pumpAndSettle after tap