Angular karma代码覆盖率报告文件夹未生成。

Question

当我运行ng test --code-coverage命令时，有时覆盖率报告无法生成，有时可以生成，因此在进行测试套件后我无法验证覆盖率声明。

我的Karma配置如下：

// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular-devkit/build-angular'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage-istanbul-reporter'),
      require('@angular-devkit/build-angular/plugins/karma')
    ],
    client: {
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    coverageIstanbulReporter: {
      dir: require('path').join(__dirname, '../coverage'),
      reports: ['html', 'lcovonly'],
      fixWebpackSourcePaths: true
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    singleRun: false
  });
};

- Raj Kumar

Answer 1

在我的情况下，一切似乎都正确，但控制台上没有生成覆盖文件或消息。

解决问题的方法是编辑angular.json文件，添加以下键：

projects.ClientApp.test.options.codeCoverage = true;

- Alex Parloti

Answer 2

你的代码覆盖率没有生成的原因是，有一些不完整的单元测试导致了代码覆盖文件夹的生成停止。即使有时也会生成，但这也比平常花费更多时间。按照以下步骤来识别和修复单元测试，以便每次都能生成代码覆盖文件夹：

1. 使用 npm test 运行测试。
2. 打开浏览器并检查测试，不应该有任何损坏或失败的测试用例。
3. 它不应该给出任何控制台错误（在控制台上验证并修复它）。
4. 验证所有单元测试都正常运行并成功通过。有时它会显示通过的单元测试，但会出现一些弹出窗口错误或控制台错误，因此这些测试会阻止单元测试代码覆盖的生成。

修复所有测试，它应该每次都生成单元测试代码覆盖文件夹。

- Neeraj Shende

---

不，但测试套件全部都是绿色的。没有错误或中断。 - Raj Kumar

但我没有检查控制台错误，会再次检查，谢谢。 - Raj Kumar

只需在控制台上检查，或者如果您收到错误警报，则解决所有问题。当我修复它们时，我遇到了类似的问题，花费了我很多时间来确定确切的问题。 - Neeraj Shende

另外，如果它有帮助，请不要忘记投票答案。 - Neeraj Shende

你好，我的控制台出现了一个警告错误。看起来你正在一个表单字段上同时使用ngModel和formControlName。在Angular v6中，使用ngModel输入属性和ngModelChange事件与响应式表单指令的支持已经被废弃，而在Angular v7中将会被移除。 - Raj Kumar

尝试以某种方式修复它，你可以尝试使用--sourceMap=false选项，这将帮助您详细了解错误。 - Neeraj Shende

Answer 3

通过以下命令生成新的代码覆盖率文件夹。

node --max_old_space_size=4096 ./node_modules/karma/bin/karma start ./test-config/karma.conf.js --coverage

- Maheshvirus

Answer 4

请在您的 Karma.conf.js 文件中添加以下配置：

module.exports = function(config) {
  config.set({
   ...
   coverageReporter: {
      dir: require('path').join(__dirname, 'dist/coverage/app-coverage'),
      subdir: '.',
      reporters: [
        { type: 'html' },
        { type: 'text-summary' },
        { type: 'cobertura' }
      ]
    }
   }

然后运行：

ng test  --code-coverage=true

它将生成精确的代码覆盖率报告，现在前往目录dist/coverage/app-coverage并在浏览器中打开index.html文件。它将为每个文件提供代码覆盖率以及需要覆盖哪些代码部分。

- Yogesh Borkhade