使用--single-file选项自定义Allure报告的可行性咨询

为什么常规插件方式行不通？ #

用--single-file生成的是独立HTML文件，不会创建常规报告的插件目录结构，所以直接用custom-logo-plugin那套流程走不通，但有两种可行方案：

方案一：先做常规自定义报告，再转单文件（推荐） #

先按正常流程生成带Logo和自定义标题的报告，再打包成单文件：

1. 搭建自定义配置目录
   新建allure-config文件夹，里面再建plugins/custom-logo-plugin子目录：
   • 把你的企业Logo命名为logo.png放进这个子目录
   • 新建plugin.js，内容写：

     // 修改报告标题
     allure.api.addTranslation('en', {
       header: {
         title: '你的自动化测试报告'
       }
     });
     // 添加自定义Logo
     allure.api.addLogo('logo.png');
     

2. 生成并转单文件
   运行这两条命令：

   # 先生成带自定义配置的常规报告
   allure generate ./reports/allure-results --clean -c ./allure-config
   # 把报告目录转成单HTML文件（需要先装html-inline：npm install -g html-inline）
   npx html-inline allure-report/index.html > ./reports/allure-single.html
   # 打开单文件报告
   open ./reports/allure-single.html
   

方案二：直接修改生成的单文件（临时应急用） #

如果只是临时改一次，直接编辑生成的HTML文件就行：

1. 先运行你的原命令生成单文件：

   allure generate ./reports/allure-results --clean --single-file ./reports/allure-single.html
   

2. 用编辑器打开这个HTML文件：
   • 找<title>标签或者页面顶部的标题文字，替换成你要的标题
   • 把Logo转成Base64编码（网上搜Base64图片转换工具就行），找到页面里默认的Allure Logo元素，替换成你的Base64图片代码

额外提示 #

• 自定义标题也可以在WDIO测试代码里设置，比如用allure.addEpic()或者修改测试套件的元数据，再结合方案一的流程
• 作为新手，先把常规Allure报告的自定义玩明白，再搞单文件的会更顺畅

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