angular 13: --code-coverage prints Coverage summary with Unknown%

[simplejason]

🐞 Bug report

Command (mark with an x)

• new
• build
• serve
• test
• e2e
• generate
• add
• update
• lint
• extract-i18n
• run
• config
• help
• version
• doc

Is this a regression?

Yes, the previous version in which this bug was not present was:

^12.1.0
Updated: It work well in new project with v13(even they use same karma.config.js, it still failed in older project, upgrade from 12 to 13), I'm checking the differences.

Description

A clear and concise description of the problem...

$ ng test --no-watch --no-progress --browsers=ChromeHeadlessCI --code-coverage
// in 13.0.2, it will print messages below but it works well under angular v12.x
// I'm not sure if something wrong I configured or just some break changes happened in v13.x :(
=============================== Coverage summary ===============================
Statements   : Unknown% ( 0/0 )
Branches     : Unknown% ( 0/0 )
Functions    : Unknown% ( 0/0 )
Lines        : Unknown% ( 0/0 )
================================================================================

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

const tags = process.env && process.env['NG_TEST_TAGS'];
const processENV = require('process');
processENV.env.CHROME_BIN = require('puppeteer').executablePath();

module.exports = function(config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular-devkit/build-angular', 'viewport'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-spec-reporter'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage'),
      require('karma-junit-reporter'),
      require('@angular-devkit/build-angular/plugins/karma'),
      require('karma-viewport')
    ],
    client: {
      jasmine: {
        random: false
      },
      clearContext: true, // leave Jasmine Spec Runner output visible in browser
      ...tags && { args: [tags] }
    },
    coverageReporter: {
      subdir: '.',
      dir: require('path').join(__dirname, '../coverage-report'),
      reporters: [
        { type: 'html' },
        { type: 'text-summary' },
        { type: 'lcovonly' },
        { type: 'cobertura' },
      ],
    },
    reporters: ['progress', 'kjhtml', 'spec', 'junit'],
    junitReporter: {
      outputDir: '../junit'
    },
    specReporter: {
      maxLogLines: 5,
      suppressErrorSummary: true,
      suppressFailed: false,
      suppressPassed: false,
      suppressSkipped: true,
      showSpecTiming: false
    },
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    customLaunchers: {
      ChromeHeadlessCI: {
        base: 'ChromeHeadless',
        flags: ['--no-sandbox']
      }
    },
    singleRun: false,
    browserNoActivityTimeout: 1000 * 60 // (Default: 10000)
  });
};

🔬 Minimal Reproduction

🔥 Exception or Error

...
Chrome Headless 88.0.4298.0 (Mac OS 11.0.0): Executed 1827 of 1831 (skipped 4) SUCCESS (54.073 secs / 37.689 secs)
TOTAL: 1827 SUCCESS


=============================== Coverage summary ===============================
Statements   : Unknown% ( 0/0 )
Branches     : Unknown% ( 0/0 )
Functions    : Unknown% ( 0/0 )
Lines        : Unknown% ( 0/0 )
================================================================================

🌍 Your Environment

Angular CLI: 13.0.2
Node: 14.17.5
Package Manager: npm 6.14.14
OS: darwin x64

Angular: 13.0.1
... animations, cdk, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... platform-server, router, service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1300.2
@angular-devkit/build-angular   13.0.2
@angular-devkit/core            13.0.2
@angular-devkit/schematics      13.0.2
@angular/cli                    13.0.2
@nguniversal/builders           13.0.1
@nguniversal/express-engine     13.0.1
@schematics/angular             13.0.2
ng-packagr                      13.0.3
rxjs                            6.6.7
typescript                      4.4.4

Anything else relevant?

[alan-agius4]

I'm sorry, but we can't reproduce the problem following the instructions you provided. Can you setup a minimal repro please?

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

[simplejason]

I'm sorry, but we can't reproduce the problem following the instructions you provided. Can you setup a minimal repro please?

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

Thanks for your reply, it only happens when --browsers=ChromeHeadlessCI is passed, I think something may be missed in my karma.config.js, I will try to find out what I missed or configured wrong, I will update this issue after that :)

[simplejason]

Updated:
When I move my-lib/src/test.ts to my-lib/test.ts(also change the file path in tsconfig.spec.json and tsconfig.lib.json), Coverage summary will return Unknown%(test.ts in src works fine), it's same when src/test.ts and src/xxx.component.ts|spec.ts are under same folder, I think it's related with webpack, still in progress...

angular.json
{
...
    "test": {
      "builder": "@angular-devkit/build-angular:karma",
      "options": {
        "main": "projects/my-lib/test.ts",
        "tsConfig": "projects/my-lib/tsconfig.spec.json",
        "karmaConfig": "projects/my-lib/karma.conf.js"
      }
    }
...
}

// It will show unknown% when I execute
`ng test --watch=false --progress=false --browsers=Chrome --code-coverage`
.
├── angular.json
├── my-lib // angular library
│   ├── src
│   ├── karma.conf.js
│   ├── polyfills.ts
│   ├── test.ts               // move from src/test.ts
│   ├── tsconfig.lib.json
│   ├── tsconfig.json       // extends ../tsconfig.json, custom angularCompilerOptions&compilerOptions here 
│   └── tsconfig.spec.json // extends ./tsconfig.json above
├── package.json
├── tsconfig.app.json
├── tsconfig.json
└── tsconfig.spec.json

[alan-agius4]

@simplejason, I am still unable to replicate this issue with the steps you provided above.

Please setup a minimal reproduction. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

This might be related to your directory structure so its really important to get an accurate repro to diagnose this.

[simplejason]

@simplejason, I am still unable to replicate this issue with the steps you provided above.

Please setup a minimal reproduction. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

This might be related to your directory structure so its really important to get an accurate repro to diagnose this.

Fixed by this issue ( #19070 )，I think we can close this one now, thanks again!

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}