You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

能否将自定义报告嵌入GitHub Action运行页面?

解决Cypress Mochawesome报告嵌入GitHub Action运行详情页的方案

方法1:提取测试结果生成Markdown嵌入Summary

GitHub Actions的Job Summary支持直接渲染Markdown内容,你可以通过脚本提取mochawesome生成的JSON格式报告里的关键数据,生成结构化Markdown后写入$GITHUB_STEP_SUMMARY文件,实现结果直接嵌入运行详情页。

步骤:

  1. 确保Cypress配置生成JSON格式报告(默认已开启,也可手动配置):
module.exports = defineConfig({
  reporter: 'cypress-mochawesome-reporter',
  reporterOptions: {
    reportDir: 'cypress/reports',
    overwrite: false,
    html: true,
    json: true // 强制生成JSON格式报告,用于提取数据
  },
  e2e: {
    setupNodeEvents(on, config) {
      require('cypress-mochawesome-reporter/plugin')(on);
    },
  },
});
  1. 在GitHub Action工作流中添加步骤,用Node.js脚本提取数据并生成Summary:
- name: 生成测试结果摘要
  run: |
    node -e "
    const fs = require('fs');
    const report = JSON.parse(fs.readFileSync('./cypress/reports/mochawesome.json', 'utf8'));
    const failCases = report.results.filter(r => r.failures > 0).map(r => {
      const failDetails = r.tests.filter(t => t.state === 'failed').map(t => `- ${t.title}: ${t.err.message}`).join('\n');
      return `### ${r.fullTitle}\n${failDetails}`;
    }).join('\n');

    const summaryContent = `
## Cypress 测试运行结果
| 统计项 | 数值 |
|--------|------|
| 总用例数 | ${report.stats.tests} |
| 通过 | ${report.stats.passes} |
| 失败 | ${report.stats.failures} |
| 跳过 | ${report.stats.skipped} |
| 总耗时 | ${(report.stats.duration / 1000).toFixed(2)}s |

${failCases ? '### 失败用例详情\n' + failCases : '### 失败用例详情:无'}
    `;
    fs.writeFileSync(process.env.GITHUB_STEP_SUMMARY, summaryContent);
    "
  if: always() # 即使测试失败也要生成摘要
  1. 可选:上传完整HTML报告作为工件,方便查看细节:
- name: 上传完整测试报告
  uses: actions/upload-artifact@v4
  with:
    name: cypress-full-report
    path: cypress/reports
  if: always()

方法2:转成JUnit格式后用现成Action生成结构化Summary

如果想要和dotnet-tests-report类似的结构化展示,可以先将mochawesome报告转成JUnit格式,再用社区Action解析生成Summary:

  1. 添加依赖并转换报告格式:
- name: 安装报告转换工具
  run: npm install mochawesome-merge mochawesome-junit-reporter

- name: 将Mochawesome报告转成JUnit格式
  run: npx mochawesome-merge cypress/reports/*.json | npx mochawesome-junit-reporter --report-dir cypress/reports/junit
  1. 用第三方Action生成结构化Summary:
- name: 发布测试结果到Summary
  uses: mikepenz/action-junit-report@v4
  with:
    report_paths: 'cypress/reports/junit/*.xml'
    detailed_summary: true
    fail_on_failure: false
  if: always()

关键注意事项

  • 必须添加if: always(),否则测试失败时后续生成Summary的步骤会被跳过
  • 若使用并行测试,需用mochawesome-merge合并多个JSON报告后再处理
  • GitHub Summary支持大部分Markdown语法,可根据需求自定义摘要格式

内容的提问来源于stack exchange,提问作者zorglub76

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.15 10:51:13