karma插件之karma-coverage

karma test

目录:

karma-coverage

项目地址: karma-coverage

使用istanbul生成代码覆盖率

翻译不当之处请指出

安装

• npm npm i -D karma karma-coverage
• yarn yarn add -D karma karma-coverage

配置

type

• 类型: String
• 描述: 指定一个记录类型
• 可能的值:
  
  • html(默认)
  • lcov(lcov and html)
  • lcovonly
  • text
  • text-summary
  • cobertura(xml格式的支持Jenkins)
  • teamcity
  • json
  • json-summary
  • in-memory
  • none

dir

• 类型: String
• 描述: 这将用于输出代码覆盖报告

subdir

• 类型: String | Function
• 描述: 这将是用来补充coverageReporter.dir选项来生成完整的输出目录路径。默认情况下,输出目录设置为./config.dir/BROWSER_NAME/,这个选项允许你自定义第二部分。你可以传递一个字符串或一个函数将调用的浏览器名称作为唯一的参数进行传递。

coverageReporter: {
  dir: 'coverage',
  subdir: '.'
  // 将结果输出到'./coverage/'
}

coverageReporter: {
  dir: 'coverage',
  subdir: 'report'
  // 将结果输出到'./coverage/report/'
}

coverageReporter: {
  dir: 'coverage',
  subdir: function(browser) {
    return browser.toLowerCase().split(/[ /-]/)[0];
  }
  // 将结果输出到: './coverage/firefox/'
}

file

• 类型: String
• 描述: 如果你使用cobertura, lcovonly, teamcity, text 或者 text-summary中的一个, 你可能设置file指定输出的文件

check

• 类型: Object
• 描述: 这将用于配置覆盖率结果最低阈值,如果不符合,karma将返回一个故障。阈值,指定为正数时所需的最小百分比。当一个阈值被指定为一个负数时,它表示允许的未覆盖实体的最大数量。
  例如: statements: 90意味着最小声明覆盖率为90%。statements: -10意味着不允许超过10个未覆盖的声明。
  global适用于所有的文件, each基于每个文件。文件列表或模式可以通过exclude属性将执行文件排除在外。在each的基础上,每个文件的阈值可以通过overrides属性进行覆盖

coverageReporter: {
  check: {
    global: {
      statements: 50,
      branches: 50,
      functions: 50,
      lines: 50,
      excludes: [
        'foo/bar/**/*.js'
      ]
    },
    each: {
      statements: 50,
      branches: 50,
      functions: 50,
      lines: 50,
      excludes: [
        'other/directory/**/*.js'
      ],
      overrides: {
        'baz/component/**/*.js': {
          statements: 98
        }
      }
    }
  }
}

watermarks

• 类型: Object
• 描述: 这将用于设置覆盖阈值颜色。第一个数字是红色和黄色之间的阈值。 第二个数字是黄色和绿色之间的阈值。

coverageReporter: {
  watermarks: {
    statements: [ 50, 75 ],
    functions: [ 50, 75 ],
    branches: [ 50, 75 ],
    lines: [ 50, 75 ]
  }
}

includeAllSources

• 类型: Boolean
• 描述: 您可以选择将覆盖预处理器所指示的所有源文件包含在代码覆盖率数据中，即使没有覆盖它们的测试。 (默认为false)

coverageReporter: {
  type : 'text',
  dir : 'coverage/',
  file : 'coverage.txt',
  includeAllSources: true
}

sourceStore

• 类型: istanbul.Store

coverageReporter: {
  type : 'text',
  dir : 'coverage/',
  file : 'coverage.txt',
  sourceStore : require('istanbul').Store.create('fslookup')
}

reporters

• 类型: Array of Objects
• 描述: 你可以使用多个选项，使用多个reporter

coverageReporter: {
  reporters:[
    {type: 'html', dir:'coverage/'},
    {type: 'teamcity'},
    {type: 'text-summary'}
  ],
}

instrumenter

• 类型: Object

useJSExtensionForCoffeeScript

• 类型: Boolean

reporter[type='in-memory']

这是一个不同的reporter。它不是物理的将报告写入磁盘，而是会触发一个coverage_complete事件。这个事件只能通过karma使用公共API才能被捕获。

例子

基本

// karma.conf.js
module.exports = function(config) {
  config.set({
    files: [
      'src/**/*.js',
      'test/**/'
    ],
    reporters: ['progress', 'coverage'],
    preprocessors: {
      'src/**/*.js': ['coverage']
    },
    coverageReporter: {
      type: 'html',
      dir: 'coverage/'
    }
  })
}

高级的，多个reporters

// karma.conf.js
module.exports = function(config) {
  config.set({
    files: [
      'src/**/*.js',
      'test/**/*.js'
    ],
    reporters: ['progress', 'coverage'],
    preprocessors: {
      'src/**/*.js': ['coverage']
    },
    coverageReporter: {
      // specify a common output directory
      dir: 'build/reports/coverage',
      reporters: [
        // reporters not supporting the `file` property
        { type: 'html', subdir: 'report-html' },
        { type: 'lcov', subdir: 'report-lcov' },
        // reporters supporting the `file` property, use `subdir` to directly
        // output them in the `dir` directory
        { type: 'cobertura', subdir: '.', file: 'cobertura.txt' },
        { type: 'lcovonly', subdir: '.', file: 'report-lcovonly.txt' },
        { type: 'teamcity', subdir: '.', file: 'teamcity.txt' },
        { type: 'text', subdir: '.', file: 'text.txt' },
        { type: 'text-summary', subdir: '.', file: 'text-summary.txt' },
      ]
    }
  });
};