Integration Testing in Flutter: Getting Started
Learn how to test UI widgets along with the backend services in your Flutter project using Integration Testing. By Monikinderjit Singh.
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress, bookmark, personalise your learner profile and more!
Create accountAlready a member of Kodeco? Sign in
Sign up/Sign in
With a free Kodeco account you can download source code, track your progress, bookmark, personalise your learner profile and more!
Create accountAlready a member of Kodeco? Sign in
Contents
Integration Testing in Flutter: Getting Started
30 mins
- Getting Started
- Setting Up a Firebase Project
- Setting Up The Android Project
- Setting Up The iOS Project
- Setting Up Authentication and Firestore
- Exploring the Starter Project
- Testing in Flutter
- Comparing Types of Testing
- Examining Unit Testing
- Examining Widget Testing
- Examining Integration Testing
- Setting Up the Project for Testing
- Adding Dependencies
- Creating a Test Directory
- Writing Your First Test
- Diving into LiveTestWidgetsFlutterBinding
- Grouping Tests
- Testing Feature One: Authentication
- Understanding pumpWidget and pumpAndSettle
- Diving Into Widget Keys
- Adding Fake Delays
- Understanding expect()
- Running the Test
- Testing Feature Two: Modifying Ideas
- Inserting New Ideas in a List
- Deleting an Idea
- Where to Go From Here?
Deleting an Idea
Now you’ll gain some insight into accessing the app’s state. Additionally, you’ll learn how to use drag gestures within the test environment.
At the top of app_test.dart, insert:
//1
import 'package:ideast/model/idea_model.dart';
//2
import 'package:provider/provider.dart';
Here a code breakdown:
- You import
IdeasModel
to access the Ideas list. - You’ll access the Ideas list using the
Provider
package. So, you import this package into the file.
Next, below the previous code, insert:
//1
final state = tester.state(find.byType(Scaffold));
//2
final title = Provider.of<IdeasModel>(state.context, listen: false).getAllIdeas[0].title;
final tempTitle = title!;
await addDelay(1000);
//TODO: add deletion code here
Here’s what you added:
-
state()
accesses the state of the current widget tree. It requires aFinder
as a parameter. In this statement, you need the state of the current Scaffold widget. - Using context, you’ll access the list of ideas present in the
IdeasModel
provider, storing title in a temporary variable tempTitle for later use.
Then, replace //TODO: add deletion code here
with:
await tester.drag(
find.byKey(ValueKey(
tempTitle.toString(),
)),
const Offset(-600, 0),
);
await addDelay(5000);
Here, drag()
scrolls or drags the widget horizontally or vertically by the given offset.
You can give a relative offset as:
- Offset(x,0): Drag towards right
- Offset(-x,0): Drag towards left
- Offset(0,y): Drag downwards
- Offset(0,-y): Drag upwards
Now, insert this code below the call to addDelay()
:
expect(find.text(tempTitle), findsNothing);
await logout(tester);
Here’s what this code does:
- The first line uses
expect()
to verify that the idea with the title tempTitle is not present. - The second line calls the
logout()
function to make the user logout.
Build and run the app. You’ll see:
Now you’ve earned the title of Integration Test Super hero for successfully learning about integration testing. Bravo!
Where to Go From Here?
You can download the complete project using the Download Materials button at the top or bottom of this tutorial.
In this tutorial, you learned when to use each type of testing, and how to:
- Test in Flutter.
- Write integration tests in Flutter UI.
- Access State.
- Create gestures in the test environment.
You can use services like Firebase Test Lab to test your app on multiple devices.
To learn more about testing, check out our tutorials on Unit Testing and Widget Testing.
If you have any suggestions, questions or if you want to show off what you did to improve this project, join the discussion below.