Cypress — merging multiple mochawesome reports

In my last post I described how to set up mochawesome reports for Cypress tests. However, I also mentioned at the end of it a problem. It generates separate file for every test suit. In this post I will describe how to solve that problem and have just one report containing all test results.

Installation

For this you will need new npm dependencies. That is mochawesome-merge package which you can download by running next CLI command:

npm install mochawesome-merge --save-dev

This command will take multiple JSON outputs and create one containing all. I know you might want HTML report, but first we need to create JSON one to generate HTML from it.

Running tests

Let’s first run tests. Because mochawesome generates separate report for each test suite, we will need to disable overwrite in report options for cypress. Also, we need to enable only JSON format, because we will be running merge on those.

// cypress.json
{
 "reporter": "mochawesome",
 "reporterOptions": {
   "charts": true,
   "overwrite": false,
   "html": false,
   "json": true,
   "reportDir": "cypress/report/mochawesome-report"
  }
 }

We can do all that with configuration above. Also, it will save reports in…