One of most common test reports used is code coverage reports. And while Cypress does support them, setting them up can be a bit of pain. In this post, I will be explaining how to set up coverage reports for unit test. If you haven’t installed Cypress yet, you can use my previous post as a guide on that.
Installation
As always, lets first start with required packages that you will need for this. Those packages are:
- @cypress/code-coverage
- babel-plugin-transform-class-properties
- instanbul-lib-coverage
- mocha@⁵.2.0
- nyc
You can install all of these by executing next CLI command:
npm install — save-de @cypress/code-coverage babel-plugin-transform-class-properties instanbul-lib-coverage mocha@⁵.2.0 nyc
Babel
Because you will be importing your modules into unit test, which are probably written in ES6, you will need .babelrc file for this. While your can be different, depending on your project, following code is minimum that you will need in it.
{ "presets": ["@babel/preset-react"], "plugins": ["transform-class-properties", "istanbul"]