Cypress — code coverage reports for unit tests

Kristijan
3 min readFeb 19, 2020

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.

Cypress logo

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"]

--

--