如何修改testcafe-reports-html报告头部的默认标题文本

方案1：直接修改依赖内置模板（临时修改用） #

• 找到项目依赖目录下的模板文件，路径一般为node_modules/testcafe-reporter-html/lib/template.html
• 打开文件后搜索代码<h1 class="text-primary">TestCafe Test Summary</h1>，直接将标签内的文本替换为你需要的自定义标题即可
• 注意：该方案修改的是本地node_modules内的文件，重新安装依赖后修改会失效，需要重新操作

方案2：使用自定义模板（长期稳定用） #

• 先将默认模板文件node_modules/testcafe-reporter-html/lib/template.html复制到项目根目录，可重命名为custom-test-report-template.html
• 打开你复制的自定义模板文件，找到对应h1标签，替换内部的标题文本为自定义内容
• 执行测试生成报告时，添加参数指定自定义模板，命令示例：

testcafe chrome tests/ --reporter html:report.html:./custom-test-report-template.html

• 该方案修改不受依赖重装影响，适合团队协作的项目使用

方案3：编程式调用时配置 #

如果你是通过Node.js API调用TestCafe生成报告，可以在reporter配置项中传入自定义模板路径，示例代码：

const createTestCafe = require('testcafe');

(async () => {
  const testcafe = await createTestCafe('localhost', 1337, 1338);
  try {
    const runner = testcafe.createRunner();
    await runner
      .src(['tests/**/*.test.js'])
      .browsers(['chrome'])
      .reporter({
        name: 'html',
        output: 'report.html',
        options: { template: './custom-test-report-template.html' }
      })
      .run();
  } finally {
    await testcafe.close();
  }
})();

内容的提问来源于stack exchange，提问作者Tzahi