我正在使用Protractor和Cucumber（js）。我想生成报告文件，就像使用Cucumber-JVM版本一样。我看过使用Protractor和Jasmine的例子，但实际上没有使用Cucumber。
使用此配置时如何生成报告？
最终目标是在Jenkins或其他任何地方发布此报告（如果它们是直接在HTML中生成的）。
谢谢！
使用最新版本的量角器（从1.5.0版开始），您现在可以生成JSON报告。当我在7个月前问过这个问题时，那个功能不存在。
您需要做的就是将其添加到protractor-config.json文件中。
resultJsonOutputFile: 'report.json'
其中report.json是输出文件的位置。
一旦你有了，你可以使用protractor-cucumber-junit（https://www.npmjs.com/package/protractor-cucumber-junit），cucumberjs-junitxml（https://github.com/sonyschan/cucumberjs-junitxml）或类似的东西将JSON文件转换为Jenkins可以显示的有效XML文件。
$ cat report.json | ./node_modules/.bin/cucumber-junit > report.xml
希望这可以帮助。
您可以使用cucumber-html-report将json报告转换为HTML。将cucumber-html-report添加到您的项目中
$ npm install cucumber-html-report --save-dev
如果你使用量角器，你可以将以下代码添加到hooks.js
var outputDir = 'someDir';
this.After(function(scenario, callback) {
if (scenario.isFailed()) {
browser.takeScreenshot().then(function(base64png) {
var decodedImage = new Buffer(base64png, 'base64').toString('binary');
scenario.attach(decodedImage, 'image/png');
callback();
}, function(err) {
callback(err);
});
} else {
callback();
}
});
var createHtmlReport = function(sourceJson) {
var CucumberHtmlReport = require('cucumber-html-report');
var report = new CucumberHtmlReport({
source: sourceJson, // source json
dest: outputDir // target directory (will create if not exists)
});
report.createReport();
};
var JsonFormatter = Cucumber.Listener.JsonFormatter();
JsonFormatter.log = function(string) {
if (!fs.existsSync(outputDir)) {
fs.mkdirSync(outputDir);
}
var targetJson = outputDir + 'cucumber_report.json';
fs.writeFile(targetJson, string, function(err) {
if (err) {
console.log('Failed to save cucumber test results to json file.');
console.log(err);
} else {
createHtmlReport(targetJson);
}
});
};
this.registerListener(JsonFormatter);当以另一个答案表明的方式使用cucumber-html-report时，您可能会遇到有关较新版本的Cucumber / Protractor / Cucumber-html-report的问题。
症状是index.html已创建，但在测试运行结束时保留为空。
这是因为cucumber-html-report正在使用异步文件写入，而量角器并没有等待它完成。 （我们使用的代码与答案中的代码有惊人的相似之处。）
这是一个有效的设置：
在hooks.js中保持屏幕截图部分与其他答案相同：
// Generate a screenshot at the end of each scenario (if failed; configurable to always)
cuke.After(function(scenario, done) {
browser.getProcessedConfig().then(config => {
if (!config.screenshots.onErrorOnly || scenario.isFailed()) {
return browser.driver.takeScreenshot().then(function(png) {
let decodedImage = new Buffer(png.replace(/^data:image\/(png|gif|jpeg);base64,/, ''), 'base64');
scenario.attach(decodedImage, 'image/png');
done();
});
} else {
done();
}
});
});
在protractor.conf.js中：
var cucumberReportDirectory = 'protractor-report';
var jsonReportFile = cucumberReportDirectory + '/cucumber_report.json';
exports.config = {
cucumberOpts: {
format: 'json:./' + jsonReportFile,
},
onCleanUp: function () {
var CucumberHtmlReport = require('cucumber-html-report');
return CucumberHtmlReport.create({
source: jsonReportFile,
dest: cucumberReportDirectory,
title: 'OptiRoute - Protractor Test Run',
component: new Date().toString()
}).then(console.log).catch(console.log);
},
ignoreUncaughtExceptions: true,
untrackOutstandingTimeouts: true
};
这只是与cucumber-html-report直接相关的配置，其余的经验丰富。
在运行测试之前，请确保报告目录存在。
通过在此处创建报表而不是将其作为Cucumber侦听器附加，Cucumber将在退出之前等待异步操作完成。
感谢Ola的原始答案，我发现了异步问题（困难的方式）并且认为当他们发现同样的问题时我可以节省一些时间。
尝试以下适用于我的代码：
你可以使用下面的插件：
https://www.npmjs.com/package/cucumber-html-reporter
在package.json中添加以下依赖项，如下所示：
"cucumber-html-reporter": "^5.0.0"
点击命令如下：
npm install
在cucumberconfig.ts中添加以下导入
import * as reporter from "cucumber-html-reporter"
现在在cucumberconfig.ts中添加以下键
onComplete: () => {
//var reporter = require('cucumber-html-reporter');
var options = {
theme: 'bootstrap',
jsonFile: './cucumberreport.json',
output: './cucumberreportsss.html',
reportSuiteAsScenarios: true,
launchReport: true,
metadata: {
"App Version":"0.3.2",
"Test Environment": "STAGING",
"Browser": "Chrome 54.0.2840.98",
"Platform": "Windows 10",
"Parallel": "Scenarios",
"Executed": "Remote"
}
};
reporter.generate(options);
},
完整文件如下所示：
import {Config} from 'protractor'
import * as reporter from "cucumber-html-reporter"
export let config: Config = {
directConnect:true,
// set to "custom" instead of cucumber.
framework: 'custom',
// path relative to the current config file
frameworkPath: require.resolve('protractor-cucumber-framework'),
seleniumAddress: 'http://localhost:4444/wd/hub',
// To run script without cucumber use below
//specs: ['typescriptscript.js'],
onComplete: () => {
//var reporter = require('cucumber-html-reporter');
var options = {
theme: 'bootstrap',
jsonFile: './cucumberreport.json',
output: './cucumberreportsss.html',
reportSuiteAsScenarios: true,
launchReport: true,
metadata: {
"App Version":"0.3.2",
"Test Environment": "STAGING",
"Browser": "Chrome 54.0.2840.98",
"Platform": "Windows 10",
"Parallel": "Scenarios",
"Executed": "Remote"
}
};
reporter.generate(options);
},
capabilities: {
'browserName': 'firefox',
'marionette': true,
//shardTestFiles: true,
},
SELENIUM_PROMISE_MANAGER: false,
specs: [
'../Features/*.feature' // accepts a glob
],
// Run feature file for cucumber use below
cucumberOpts: {
// require step definitions
require: [
'./stepDefination/*.js' // accepts a glob
],
format: 'json:cucumberreport.json',
},
jasmineNodeOpts: {
showColors: true,
},
};
要附加失败的屏幕截图，请使用以下代码挂钩
After(function(scenarioResult) {
let self = this;
if (scenarioResult.result.status === Status.FAILED) {
return browser.takeScreenshot()
.then(function (screenshot) {
const decodedImage = new Buffer(screenshot.replace(/^data:image\/png;base64,/, ''), 'base64');
self.attach(decodedImage, 'image/png');
});
}
});