angular 2 的代码覆盖率

Question

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

Answer 1

ng test --code-coverage

或

ng test --code-coverage --reporters=teamcity,coverage-istanbul

Answer 2

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

ng test --code-coverage

结果：

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

npm install --save-dev karma-teamcity-reporter
将 require('karma-teamcity-reporter') 添加到 karma.conf.js
ng test --code-coverage --reporters=teamcity,coverage-istanbul

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

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

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

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

Answer 3

首先安装依赖项。

npm install karma karma-jasmine karma-chrome-launcher karma-jasmine-html-reporter karma-coverage-istanbul-reporter

然后运行 ng测试。

ng test --code-coverage

然后运行显示您报告的服务器。

http-server -c-1 -o -p 9875 ./coverage

你应该看到这样的东西：

我写了一篇关于这个的博客 post here。

Answer 4

我在这个问题上遇到了困难。我找到的解决方案是

ng test --code-coverage

但请确保在您的 karma.conf.js 文件中指定了报告者（我使用 'coverage-istanbul'）

例如reporters: ['coverage-istanbul']

覆盖率报告将位于您的根目录中名为 'coverage' 的目录中。

angular 2 的代码覆盖率

Code coverage for angular 2

unit-testing

code-coverage

typescript

angular