Нет окна.__ покрытие__ объект создан istanbul + phantomJS

Question

Я пытаюсь использовать следующий стек для тестирования на стороне клиента, однако кажется, что istanbul, кроме генерации spec-файлов, мало что делает.

Я пробовал следующие примеры из:

здесь, здесь и здесь

однако, независимо от того, что я делаю, Стамбул, кажется, не создает в памяти ссылку на window.__coverage__ object and I'm unable to parse the output due to this.

pre-test Задача, показанная в gulpfile.js, генерирует некоторые классные инструментальные файлы, которые, похоже, никуда не денутся или не пойдут.

пожалуйста, порекомендуйте

конфигурация задачи

• глоток
• проглатывать-мокко-phantomjs
• проглатывать-Стамбул

сторона клиента

• Sinon
• кофе мокко

gulpfile.js

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()) });

мокко-phantomjs-Стамбул

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 )

Answer 1

Так что, в конце концов, после некоторой обработки, я понял, что покрывал свои тестовые файлы вместо исходных файлов, которые я тестировал.

gulpfile.js

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