Generate goldens and coverage easily from VSCode
Last week, I noticed that I was doing something regularly that could probably be improved. Even though I'm using VSCode, I was launching my tests from the terminal, having to type the file's exact location to run it. Why does it this way instead of doing it directly in VSCode?
There are two instances when I need to add a special command to my test.
- To update my goldens
- To update my coverage
I found myself launching those commands too often, and I began to ask myself, what if I could have an option to run it from VSCode? Just next to Run
and Debug
.
I did what any developer would have done ? I downloaded the source code of the DartCode extension and began to add the option manually. After less than one hour, tada ? I had the functionality added to VSCode.
But soon enough, Danny Tuppeny directed me to the correct functionality of Dart Code.
Of course, it already exists in Dart Code ?
Let's see the config you can add to your .vscode/launch.json
file to get this exact functionality:
{
"version": "0.2.0",
"configurations": [
{
"name": "Update goldens",
"type": "dart",
"request": "launch",
"args": ["--update-goldens"],
"codeLens": {
"for": [ "run-test", "run-test-file"],
"title": "Update goldens"
},
},
{
"name": "Coverage",
"type": "dart",
"request": "launch",
"args": ["--coverage"],
"codeLens": {
"for": [ "run-test", "run-test-file"],
"title": "Coverage"
},
}
]
}
The for
list is used to determine which elements to add the action. run-test
is to add the action for each test and run-test-file
add the action for the main function of a test file.
And that's it; you don't need anything else. Without even relaunching VSCode, you should now see the two new actions above your tests. You can now generate your goldens and your coverage right in VSCode!
Bonus
If you want to see the coverage directly in VSCode, you can add Coverage Gutters. It will add green marks on the left of your code to let you know which lines are correctly covered.