为 WebdriverIO/Cucumber 框架生成 HTML 报告
Generate HTML report for WebdriverIO/Cucumber framework
我正在使用 WebdriverIO/Cucumber (wdio-cucumber-framework
) for my test automation. I want to get the test execution result in a HTML file. As of now I am using Spec Reporter (wdio-spec-reporter
)。这有助于在控制台 window 中打印结果。但我想要 HTML 文件中的所有执行报告。
如何在 HTML 文件中获取 WebdriverIO 测试执行结果?
谢谢。
好的,终于有空闲时间来解决你的问题了@Thangakumar D。 WebdriverIO 报告是一个庞大的主题(有多种方法可以生成这样的报告),所以我将继续从我最喜欢的报告者开始:Allure!
- [前言:确保你在项目根目录下]
- 安装你的包(如果你还没有):
npm install wdio-allure-reporter --save-dev
- 安装Allure CommandLine(稍后你会明白为什么):
npm install -g allure-commandline --save-dev
- 设置你的
wdio.config.js
文件以支持 Allure 作为记者
wdio.config.js:
reporters: ['allure', 'dot', 'spec', 'json'],
reporterOptions: {
outputDir: './wdio-logs/',
allure: {
outputDir: './allure-reports/allure/'
}
}
- 运行 你的测试! 请注意,一旦你的回归结束,你的
/allure-results/
文件夹中已经填充了多个 .json
,.txt
、.png
(如果您有屏幕截图错误)和 .xml
文件。 Allure CommandLine 将使用此文件夹的内容来为您呈现 HTML 报告.
- 转到您的
/allure-results/
文件夹并通过以下方式生成报告:allure generate <reportsFolderPath>
(这样做 allure generate .
- 如果你想要
/allure-reports/
文件夹在 /allure-results/
)
- 现在进入您的
/allure-reports
文件夹并在您选择的浏览器中运行 index.html
(初学者使用 Firefox)
注意: 生成的 index.html
文件不会加载 Chrome 上的所有内容,除非您进行一些调整。这是由于默认 WebKit 无法加载所需的所有 AJAX 调用。阅读更多相关信息 here.
如果您成功完成了前面的所有步骤,它应该看起来像这样:
希望这对您有所帮助。干杯!
注意:我会尝试更新这个post当我有更多时间用其他很棒的方法来从您的 WebdriverIO 报告器日志生成报告,特别是如果这个 post 一路上得到一些 love/upvotes。
例如: 我喜欢使用的另一个组合是:wdio-json-reporter
/wdio-junit-reporter
加上易于使用的模板语言 Jinja2。
我一直在用Mochawesome记者,看起来很漂亮,看看吧
here。
Mochawesome 记者生成 mochoawesome.json,然后可以使用 Mochawesome report generator
创建漂亮的报告
安装:
> npm install --save wdio-mochawesome-reporter
> npm install --save mochawesome-report-generator@2.3.2
在 wdio.conf.js:
中添加这一行更容易集成
// sample wdio.conf.js
module.exports = {
// ...
reporters: ['dot', 'mochawesome'],
reporterOptions: {
outputDir: './', //mochawesome.json file will be written to this directory
},
// ...
};
将脚本添加到 package.json:
"scripts": {
"generateMochawesome": "marge path/to/mochawesome.json --reportTitle 'My project results'"
},
我正在使用 WebdriverIO/Cucumber (wdio-cucumber-framework
) for my test automation. I want to get the test execution result in a HTML file. As of now I am using Spec Reporter (wdio-spec-reporter
)。这有助于在控制台 window 中打印结果。但我想要 HTML 文件中的所有执行报告。
如何在 HTML 文件中获取 WebdriverIO 测试执行结果?
谢谢。
好的,终于有空闲时间来解决你的问题了@Thangakumar D。 WebdriverIO 报告是一个庞大的主题(有多种方法可以生成这样的报告),所以我将继续从我最喜欢的报告者开始:Allure!
- [前言:确保你在项目根目录下]
- 安装你的包(如果你还没有):
npm install wdio-allure-reporter --save-dev
- 安装Allure CommandLine(稍后你会明白为什么):
npm install -g allure-commandline --save-dev
- 设置你的
wdio.config.js
文件以支持 Allure 作为记者
wdio.config.js:
reporters: ['allure', 'dot', 'spec', 'json'],
reporterOptions: {
outputDir: './wdio-logs/',
allure: {
outputDir: './allure-reports/allure/'
}
}
- 运行 你的测试! 请注意,一旦你的回归结束,你的
/allure-results/
文件夹中已经填充了多个.json
,.txt
、.png
(如果您有屏幕截图错误)和.xml
文件。 Allure CommandLine 将使用此文件夹的内容来为您呈现 HTML 报告. - 转到您的
/allure-results/
文件夹并通过以下方式生成报告:allure generate <reportsFolderPath>
(这样做allure generate .
- 如果你想要
/allure-reports/
文件夹在/allure-results/
) - 现在进入您的
/allure-reports
文件夹并在您选择的浏览器中运行index.html
(初学者使用 Firefox)
注意: 生成的 index.html
文件不会加载 Chrome 上的所有内容,除非您进行一些调整。这是由于默认 WebKit 无法加载所需的所有 AJAX 调用。阅读更多相关信息 here.
如果您成功完成了前面的所有步骤,它应该看起来像这样:
希望这对您有所帮助。干杯!
注意:我会尝试更新这个post当我有更多时间用其他很棒的方法来从您的 WebdriverIO 报告器日志生成报告,特别是如果这个 post 一路上得到一些 love/upvotes。
例如: 我喜欢使用的另一个组合是:wdio-json-reporter
/wdio-junit-reporter
加上易于使用的模板语言 Jinja2。
我一直在用Mochawesome记者,看起来很漂亮,看看吧 here。
Mochawesome 记者生成 mochoawesome.json,然后可以使用 Mochawesome report generator
创建漂亮的报告安装:
> npm install --save wdio-mochawesome-reporter
> npm install --save mochawesome-report-generator@2.3.2
在 wdio.conf.js:
中添加这一行更容易集成 // sample wdio.conf.js
module.exports = {
// ...
reporters: ['dot', 'mochawesome'],
reporterOptions: {
outputDir: './', //mochawesome.json file will be written to this directory
},
// ...
};
将脚本添加到 package.json:
"scripts": {
"generateMochawesome": "marge path/to/mochawesome.json --reportTitle 'My project results'"
},