javascript – Karma-Coverage报告显示代码覆盖(显然没有涵盖)

我试图生成 HTML覆盖率报告,但它不包含我期望的输出.也许我在这里错了,但它应该只显示从spec文件中调用的那些行和方法,对吧？

不知怎的,它没有.

更新：

我创建了一个存储库来提供一个工作示例,概述了问题：

https://github.com/gearsdigital/stunning-octo-train

这是我的(测试)项目设置.如果需要,我可以将它推送到GitHub仓库,因为我不知道如何设置JSfiddle来运行此代码.

TL; DR

有一个生成HTML覆盖率报告的过程.此报告显示所涵盖的代码,由于没有可用的测试,因此显然没有涵盖.

karma.conf.js：

var webpack = require('webpack');
var path = require('path');

// Reference webpack.config.js,don't repeat it!
var webpackConfig = require('./webpack.config.js');

// The entry point from the referenced Webpack configuration has to be
// removed or tests will fail in weird and inscrutable ways.
// Easy enough,just define an empty entry object (null won't work).
webpackConfig.entry = {};
webpackConfig.module = {
    preLoaders: [
        {
            test: /\.js$/,// files within these directories should be excluded
            // for babel processing
            exclude: /(node_modules)/,loaders: ['babel?cacheDirectory']
        },{
            test: /\.js$/,include: /(src\/js)/,exclude: /(vendor)/,loaders: ['isparta']
        }
    ]
};

/**
 * Karma configuration
 * @param config
 */
module.exports = function (config) {
    config.set({
        browsers: ['PhantomJS'],coverageReporter: {
            dir: 'test-results',reporters: [
                {type: 'text-summary'},{type: 'html',subdir: 'coverage'}
            ]
        },files: [
            'webpack.test.config.js'
        ],frameworks: [
            'jasmine'
        ],preprocessors: {
            'webpack.test.config.js': ['webpack']
        },reporters: ['spec','coverage'],webpack: webpackConfig
    });
};

webpack.config.js：

var webpack = require('webpack');
var path = require('path');

module.exports = {
    plugins: [
        new webpack.ProvidePlugin({
            $: "jquery",jQuery: "jquery","window.jQuery": "jquery"
        })
    ]
};

webpack.test.config.js：

// make sure the file name regexp matches your test files.
var testsContext = require.context('./tests',true,/\.spec\.js$/);
testsContext.keys().forEach(testsContext);

// make sure the file name regexp matches your test files.
var srcContext = require.context('./src/js',/\.js$/);
srcContext.keys().forEach(srcContext);

bootstrap.js：

import {Calculator} from './modules/Calculator';
let c = new Calculator();
c.add(1,2); // 3

Calculator.js：

export class Calculator {
    add(op1,op2) {
        return op1 + op2;
    }

    sub(op1,op2) {
        if (typeof op1 !== 'number') {
            return false;
        }
        return op1 - op2;
    }

    mul(op1,op2) {
        return op1 * op2;
    }

    div(op1,op2) {
        return op1 / op2;
    }
}

bootstrap.spec.js：

import {Calculator} from '../src/js/modules/Calculator';

describe('Calculator',function () {

    it('should return 10',function () {
        expect(true).toBe(false);
    });

});

生成的报告：

我希望发现add(),因为它不是在任何测试中调用,而是在bootstrap.js中调用.

项目结构：

解决方法

src / js / bootstrap.js被加载;这意味着这些行被执行.

import {Calculator} from './modules/Calculator';
let c = new Calculator();
c.add(1,2); // 3

我猜这块是罪魁祸首：

{
        test: /\.js$/,loaders: ['isparta']
    }

我的代码不应该只在测试期间运用吗？

最简洁的答案是不.

导入模块时,可能会覆盖任何不在闭包/函数/方法中的内容.

// this will get coverage; because it is top-level code outside a function block
var dummy = null;

export class Calculator {
    add(op1,op2) {
        // this will get coverage only if you call explicitly the function.
        return op1 + op2;
    }
}

// this will get coverage.
var c = new Calculator();
// and Now,Calculator.add will get coverage.
c.add(1,2); // 3