How to run Flutter tests with Coverage
When it comes to testing Flutter applications, running tests with coverage is an important step. This allows developers to measure how well their tests cover the code and find areas that need further testing. In this post, we will look at how to run Flutter tests with coverage and explore different tools to create detailed reports based on the coverage data.
Running tests with coverage
Running tests with coverage in Flutter is a straightforward process. By executing the command flutter test --coverage, we can run our tests and collect coverage information.
The command creates a folder called coverage in our project, which contains a file called lcov.info. This file holds the coverage data, but it may not be easy to understand on its own.
SF:lib\main.dart
DA:3,0
DA:4,0
DA:8,1
DA:10,0
DA:20,2
DA:22,1
DA:23,1
DA:27,1
DA:28,3
DA:32,3
DA:39,0
LF:11
LH:7
end_of_record
Fortunately, there are tools available to generate more helpful reports. Let us explore a few of them.
1. Using the LCOV viewer
One easy option is to use the LCOV viewer website. Simply drag and drop the lcov.info file into the viewer, and it will generate a report that is both informative and visually appealing.
2. Using the test_cov_console package
Another approach is to use the test_cov_console package. To get started, install the package by running flutter pub add test_cov_console --dev.
Make sure that the package is included under the dev_dependencies section in your pubspec.yaml file.
dev_dependencies:
flutter_test:
sdk: flutter
test_cov_console: ^0.2.2
Once the package is installed, you can generate a report in your command-line interface by running dart run test_cov_console.
If you prefer a CSV file, add the -c flag like this: dart run test_cov_console -c.
Depending on your IDE it is possible to display the CSV file like the screenshot above. This gives a clear report, however, the visual appearance of the LCOV viewer looks better. However, this approach is useful when you do not have internet access or if you want a simple report.
3. Installing LCOV locally on Windows
This last approach is specifically for Windows machines.
To get started we need to install Chocolatey, we can do this by opening our command prompt as Administrator and executing the following command:
@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://community.chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
Your Command Prompt should give you a different message, I am getting this message because I already have Chocolatey installed.
If you run into any issues see their installation documentation.
After we successfully installed Chocolatey. We need to install the lcov package. We can do this by executing choco install lcov in the same Command Prompt.
Now that we have lcov installed we need to navigate to our project inside our Command Prompt. Use cd followed by your full project path like so: cd C:\Users\tijnv\Documents\Codeonwards\demo\codeonwards_demo.
After we have navigated to our project we can execute the following command: perl C:\ProgramData\chocolatey\lib\lcov\tools\bin\genhtml -o coverage\html coverage\lcov.info to generate our reports using lcov.
If we check the coverage folder of our project you will see that we generated a bunch of files.
The index.html is the file that contains our report. You can open this file inside the browser.
There are 3 ways to open it in the browser:
- By using your IDE;
- By navigating to the files using File Explorer and clicking on them; (You might have to right-click the file and select Open with, followed by clicking your preferred browser)
- By using the Command Prompt:
When we open the file in the browser you can see that we get a very nice report:
But that is not all, we also generated a coverage report for the file that we have tested. In my case, this is the main.dart file. As you can see in the last screenshot of the Command Prompt, I also opened coverage/html/lib/main.dart.gcov.html.
As you can see this is a very convenient report showing you exactly which lines are and are not covered.
Conclusion
In this post, we explored different methods to run Flutter tests with coverage and generate informative reports.
We learned that the LCOV viewer website provides an easy way to drop the lcov.info file and obtain visually appealing reports. Additionally, the test_cov_console package allows us to generate reports in the command-line interface or as CSV files, which is useful when internet access is limited or when a simpler report is enough.
For Windows users, we discussed installing Chocolatey and using it to install the lcov package. This enables the generation of detailed coverage reports through specific commands in the Command Prompt.
