Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can the code coverage data from Flutter tests be displayed?

I'm working on a Flutter app using Android Studio as my IDE. I'm attempting to write tests and check the code coverage but I can't work out how to view the data in the IDE or any other application.

By running flutter test --coverage, a coverage report seems to be generated into a file /coverage/lcov.info. That file looks something like this:

SF:lib\data\Customer.g.dart
DA:9,2
DA:10,2
DA:11,2
DA:12,2
DA:13,2
DA:20,0
DA:21,0
DA:22,0
DA:23,0
DA:24,0
...

Looking at the file it seems to have a list of my project files with line by line coverage data. Is there a way to view this information in Android Studio?

like image 928
peopletookallthegoodnames Avatar asked Jun 11 '18 01:06

peopletookallthegoodnames


People also ask

How do you show code coverage?

To calculate the code coverage percentage, simply use the following formula: Code Coverage Percentage = (Number of lines of code executed by a testing algorithm/Total number of lines of code in a system component) * 100.

How do I get code coverage results?

Code coverage option is available under the Test menu when you run test methods using Test Explorer. The results table shows the percentage of the code executed in each assembly, class, and procedure. The source editor highlights the tested code.


Video Answer


3 Answers

You can also install lcov and convert the lcov.info file to HTML pages and then see the result in the browser with sorting option.

1. Installation

1.1. Installing in Ubuntu

sudo apt-get update -qq -y
sudo apt-get install lcov -y

1.2. Installing in Mac

brew install lcov

2. Run tests, generate coverage files and convert to HTML

flutter test --coverage
genhtml coverage/lcov.info -o coverage/html

Note This way you can add it to circleci artifacts and coveralls as well.

like image 155
Jak Avatar answered Oct 19 '22 22:10

Jak


This is what you want to run to see tests coverage in your browser on macOS

flutter test --coverage
genhtml coverage/lcov.info -o coverage/html
open coverage/html/index.html
like image 44
Adam Smaka Avatar answered Oct 19 '22 22:10

Adam Smaka


You can view the code coverage generated by flutter with the Atom editor.
You just need to install the Dart and lcov-info packages.

Then you load your project folder and press Ctrl+Alt+c, coverage will be displayed with a summary of the whole projects coverage and also with specific line highlighting.

There doesn't appear to be any plugin for Android studio which does this as of yet.

like image 12
peopletookallthegoodnames Avatar answered Oct 19 '22 20:10

peopletookallthegoodnames