从 Cypress 中填充的 JSON 文件生成空的 HTML Mochawesome 报告

Question

我正在尝试生成一份 mochawesome 报告，其中包含我的 Cypress 测试套件中规范文件的所有结果。

这是我的 package.json:

{
    "test": "npx cypress run",
    "combine-reports": "mochawesome-merge cypress/reports/mochawesome-report/*.json > mochareports/report.json",
    "generate-report": "marge mochareports/*.json --reportDir mochawesome --assetsDir mochawesome/assets --reportPageTitle index.html"
  },
  "devDependencies": {
    "cypress": "^9.5.4",
    "mocha": "^9.2.2",
    "mochawesome": "^7.1.3",
    "mochawesome-merge": "^4.2.1",
    "mochawesome-report-generator": "^6.2.0"
  }
}

npm run test 按预期工作。

运行 npm run combine-reports，按预期创建 mochareports/report.json。我在文本编辑器中打开了该文件，其中填充了测试统计信息、结果等。

运行 npm run generate-report 在控制台上显示 Reports saved。如果我在 VS Code 中打开 HTML 页面 (cypress/reports/mochareports/report.html)，则会出现 HTML。但是，如果我在网络浏览器中打开它，我会得到一个空白 HTML 页面和以下控制台错误：

正在生成 HTML 报告，但由于某种原因在 Web 浏览器中显示为空白页。

有人可以告诉我如何解决这个问题吗？

Answer 1

如果你也加上cypress.json文件就更好了，不过我会用一个简单的例子来解释，

这是我的cypress.json报告配置

{
  "reporter": "cypress-multi-reporters",
  "reporterOptions": {
    "reporterEnabled": "mochawesome",
    "mochawesomeReporterOptions": {
      "reportDir": "cypress/reports/mocha",
      "quite": true,
      "overwrite": false,
      "html": false,
      "json": true
    }
  }
}

并且在您的 package.json 中我没有看到合并所有 json 文件的脚本例如：

"scripts": {
    "clean:reports": "rm -R -f cypress/reports && mkdir cypress/reports && mkdir cypress/reports/mochareports ",
    "pretest": "npm run clean:reports",
    "scripts": "cypress run",
    "combine-reports": "mochawesome-merge cypress/reports/mocha/*.json > cypress/reports/mochareports/report.json",
"generate-report": "marge cypress/reports/mochareports/report.json -f report -o cypress/reports/mochareports -- inline",
    "posttest": "npm run combine-reports && npm run generate-report",
    "test" : "npm run scripts || npm run posttest"
  }

你也可以在这里得到一些想法 - https://medium.com/tech-learn-share/attach-screenshot-into-mochawesome-html-report-in-cypress-ca3792081474

从 Cypress 中填充的 JSON 文件生成空的 HTML Mochawesome 报告

Generating empty HTML Mochawesome report from populated JSON file in Cypress

cypress

mochawesome