我正在尝试使用以下堆栈进行客户端测试, 然而,除了生成spec文件之外,似乎伊斯坦布尔并没有做太多。
我尝试过以下各种示例:
然而,无论我做什么,伊斯坦布尔似乎都没有创建window.__coverage__ object and I'm unable to parse the output due to this.
gulpfile.js下显示的pre-test
任务确实生成了一些时髦的检测文件,这些文件似乎没有或去任何地方。
请告知
gulp.task('pre-test', function () {
return gulp.src(['tests/ar.config.js'])
// Covering files
.pipe(istanbul())
// Write the covered files to a temporary directory
.pipe(gulp.dest('coverage/'));
});
gulp.task('test', ['inject', 'pre-test'], function () {
return gulp
.src('index.html', {read: false})
.pipe(mochaPhantomJS(
{
reporter: 'spec',
phantomjs: {
hooks: 'mocha-phantomjs-istanbul',
coverageFile: './coverage/coverage.json'
}
}))
.pipe(istanbul.writeReports())
});
var system = require('system');
var fs = require('fs');
function collectCoverage(page) {
// istanbul stores coverage in global.__coverage__
var coverage = page.evaluate(function () {
return window.__coverage__;
});
// fail gracefully when we don't have coverage
if (!coverage) {
console.log("no coverage found!")
return;
}
// read coverageFile from mocha-phantomjs args
var phantomOpts = JSON.parse(system.args[system.args.length - 1]);
var coverageFile = phantomOpts.coverageFile || 'coverage/coverage.json';
// write coverage to file
var json = JSON.stringify(coverage);
fs.write(coverageFile, json);
}
// beforeStart and afterEnd hooks for mocha-phantomjs
module.exports = {
afterEnd: function (runner) {
collectCoverage(runner.page);
}
};
...
✓ test x
✓ test y
✓ test z
----------|----------|----------|----------|----------|----------------|
File | % Stmts | % Branch | % Funcs | % Lines |Uncovered Lines |
----------|----------|----------|----------|----------|----------------|
----------|----------|----------|----------|----------|----------------|
All files | 100 | 100 | 100 | 100 | |
----------|----------|----------|----------|----------|----------------|
=============================== Coverage summary ===============================
Statements : 100% ( 0/0 )
答案 0 :(得分:0)
所以最后经过一些修补,我意识到我正在覆盖我的测试文件,而不是我正在测试的源文件。
var gulp = require('gulp');
var inject = require('gulp-inject');
var istanbul = require('gulp-istanbul');
var mochaPhantomJS = require('gulp-mocha-phantomjs');
var istanbulReport = require('gulp-istanbul-report');
gulp.task('instrument', function () {
return gulp.src(['src/js/**/*.js'])
// Covering files
.pipe(istanbul({
coverageVariable: '__coverage__'
}))
// instrumented files will go here
.pipe(gulp.dest('coverage/'))
});
gulp.task('test', ['instrument', 'inject'], function () {
return gulp
.src('index.html', {read: false})
.pipe(mochaPhantomJS({
reporter: ["spec"],
phantomjs: {
useColors: true,
hooks: 'mocha-phantomjs-istanbul',
coverageFile: './coverage/coverage.json'
}
}))
.on('finish', function () {
gulp.src("./coverage/coverage.json")
.pipe(istanbulReport({
reporters: ['text', 'html']
}))
});
});
var paths = {
"javascript": ["coverage/**/*.js"],
tests: ["tests/**/*.js"]
};
gulp.task('inject', ['instrument'], function (cb) {
return gulp.src('index.html')
.pipe(inject(
gulp.src(paths.javascript,{read: false}), {
relative: true
}))
.pipe(inject(
gulp.src(paths.tests, {read: false}), {
relative: true,
starttag: "<!-- inject:tests:js -->"
}))
.pipe(gulp.dest('.'))
});
我写了以下帖子,解释了我试图实现的测试方法的全过程,如果有人想听听所有这些背后的理论:
http://blog.silicak.es/2016-07-07-testing-browser-gulp-phantomJS-mocha-istanbul