Cypress web自动化25-生成mochawesome-report合并报告

前言

前一篇通过生成的 xml 报告最后用 allure 生成一个html报告内容。

我们也可以生成json格式的报告，最后把json格式报告合并成一个，最终生成一个html报告，这在分布式执行的时候用得到。

安装依赖包

我们需要安装几个依赖：

npm install --save-dev mocha mochawesome mochawesome-merge mochawesome-report-generator

安装完成后会在 package.json 文件中生成对应的依赖包版本号信息

"devDependencies": {
    "cypress": "^4.5.0",
    "mocha": "^7.2.0",
    "mochawesome": "^6.1.1",
    "mochawesome-merge": "^4.0.3",
    "mochawesome-report-generator": "^5.1.0"
  }      

然后在 cypress.json 配置

mochawesome

报告生成器，保存每一个JSON测试报告到cypress/results目录：

• reporter  选择报告生成器mochawesome
• reportDir  指定报告存放路径，不指定默认在项目目录下mochawesome-report
• overwrite  是否覆盖原来的报告
• html       是否生成html报告
• json       是否生成json文件

{
  "reporter": "mochawesome",
  "reporterOptions": {
    "reportDir": "cypress/results",
    "overwrite": false,
    "html": false,
    "json": true
  }
}      

使用

cypress run

运行用例后，就会生成

cypress/results/mochawesome.json

,

cypress/results/mochawesome_001.json

, ...等报告文件。

mochawesome-merge 合并报告

每个用例会生成一个json文件，最终我们合并成一个json文件，再把这个json报告文件生成一个html报告

npx mochawesome-merge cypress/results/*.json > merge-report.json

这样就会在项目目录生成一个

merge-report.json

文件

mochawesome-merge 4.x的版本和以前版本语法不太一样，不需要加

--reportDir

参数。

关于 mochawesome-merge 相关用法参考这篇 https://github.com/Antontelesh/mochawesome-merge/tree/master

mochawesome-report-generator

mochawesome-report-generator

生成 html 报告内容

npx mochawesome-report-generator merge-report.json

D:\Cypress>npx mochawesome-report-generator merge-report.json
npx: installed 48 in 8.545s

✓ Reports saved:
D:\Cypress\mochawesome-report\merge-report.html