Flutter Automated Tests - Getting Started
Subscribe to my newsletter and never miss my upcoming articles
Automated tests in software development help you catch bugs and many other issues with your app before you push it. This is especially useful for large apps where testing every part manually might not be possible.
Lucky for us, Flutter has different types of tests we can do.
We will look at unit and widget tests in this piece.
Unit testing is breaking your code into simple parts (units), and these parts are then tested. These units are usually functions, methods, classes, or even variables. Let’s try it out!
First, you should have the flutter_test package installed in your dev dependencies in your
Next, create a class with the code you’d like to test, I’ve named mine
we.dart and create the test file for this class, I’ve named mine
we_test.dart.The file where your code is can be in the
lib/folder and your tests should be in the
tests/ folder on the root.
The code in the class we want to test is as follows:
Here, we have a simple class with one method and one string instance. The string,
text should be edited with the sum of the parameters passed to the
populateText() method after it is called.
Our test file looks like this:
First, we import the flutter_test package and the class we want to test. Then, we start writing.
We start with the
test() method from the flutter_test package. The method accepts two parameters. First, the description of the test and second, a function with the tests to run.
Here, we first set the class
WeTest(), which we imported to a variable, then we call the
populateText method, passing in params two and three. Therefore, we expect the result of the sum to be five.
We then call the
expect() method from flutter_test, which is used to _assert_that the unit we are testing matches what is returned when the code was run. These two are called the actual and the matcher respectively.
If they match, then our tests pass, if they don’t, then it fails.
Run the test
You can run the test by opening the test file (
we_test.dart) and then run debug from the debugger on VS Code.
flutter test test/we_test.dart in your terminal.
Widget tests do exactly what they imply: test widgets.
Widget tests are different from unit tests in that they require classes and functions different from those in unit tests. These tools are part of the
Let’s get to it!
At this point, you should have the
flutter_test package installed through your
Next, we need widgets to test, so we’ll create a screen with some simple widgets:
The output is a screen with a text field (and a controller), a
RaisedButton, and a text widget (for showing the inputted text).
Now that we have widgets, let’s write our tests:
Immediately, you should start spotting the differences between this and the unit tests we wrote previously.
testWidgets()function, which creates a new
[WidgetTester](https://api.flutter.dev/flutter/flutter_test/WidgetTester-class.html)for each test, is used in place of
test()function in unit tests.
[Finder](https://api.flutter.dev/flutter/flutter_test/Finder-class.html), which is used to locate individual widgets.
- The Matcher (
findsNwidgets), which we use to verify the widgets.
pump(), which Flutter uses to build a widget. You can also set a duration for things like animations.
What’s going on here?
- First, we’re using the
testWidgets()function and passing a description for this test, and the
WidgetTesterto be used with every test case.
- Then, we build the widgets by calling
- Our first use of the
Finderclass is to find the raised button on the screen. We use the
byType()method here, but there are a lot more we can try, which I’ll try to show by using
find.byKey()later on, to find the text field with the key assigned to it.
- Next, we try to test the
TextField. First, we verify that there is a
findsOneWidgetmatcher, and then trigger a rebuild of the views.
- Calling the
enterText()method from the
[WidgetTester](https://api.flutter.dev/flutter/flutter_test/WidgetTester-class.html)allows Flutter to input text into the
TextFieldfound, then rebuild views again.
- Finally, we ask Flutter to check that the text printed on the screen is the same as the text that was inputted in the previous step.
Run the tests via your editor or run
flutter test test/widget_test.dart in your terminal. This test should pass, but play with it and see the different ways things can break.
Also, check out all the methods and examples in the classes used.
I hope this article helps you get started writing tests in your Flutter apps!