angular - Angular 2 的代码覆盖率

Question

如何找到 Angular 2 代码的代码覆盖率？有没有我可以使用的 vs 代码编辑器或 webstorm 插件？我正在使用 Jasmine 和 Karma 对我的代码进行单元测试。

Answer 1

如果你想查看总体测试覆盖率统计数据，而不是在 Angular CLI 中，你当然可以直接键入，然后查看命令提示符窗口的底部

ng test --code-coverage

结果:

如果您想查看组件的单独测试覆盖率，请按照以下步骤操作。

1. npm install --save-dev karma-teamcity-reporter

2. 将 require('karma-teamcity-reporter') 添加到 karma.conf.js 中的插件列表

3. ng 测试 --code-coverage --reporters=teamcity,coverage-istanbul

请注意，报告者列表以逗号分隔，因为我们添加了新报告者 teamcity。

运行此命令后，您可以在目录中看到文件夹 coverage 并打开 index.html 以查看测试覆盖率的图形 View 。

您还可以在 karma.conf.js 中设置您想要达到的覆盖率阈值，如下所示。

coverageIstanbulReporter: {
      reports: ['html', 'lcovonly'],
      fixWebpackSourcePaths: true,
      thresholds: {
        statements: 90,
        lines: 90,
        branches: 90,
        functions: 90
      }
    },