@angular-devkit/build-angular:jest generates incorrect coverage

maximLyakhov commented 1 year ago

Command

test

Is this a regression?

[ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

ng test command includes produced chunks in Jest test coverage instead of covering Angular source files.

Minimal Reproduction

run
- ng new repro-app --package-manager pnpm --standalone --style scss --routing
- cd repro-app
- pnpm i -D jest jest-environment-jsdom @types/jest
remove karma and jasmine related packages
angular.json
- configure test builder as in Angular Blog article on Medium
tsconfig.spec.json
- change jasmine to jest at compilerOptions.types[0]
create the following jest.config.mjs in project root:

const config = {
  cacheDirectory: "<rootDir>/.jest/cache",
  collectCoverage: true,
  coverageDirectory: "<rootDir>/coverage",
  coverageProvider: "v8",
  coverageReporters: ["text-summary", "html"],
  reporters: ["summary", "default"],
  rootDir: "./",
};

export default config;

run
- ng t

Exception or Error

Output with "v8" coverageProvider:

NOTE: The Jest builder is currently EXPERIMENTAL and not ready for production use.
The esbuild-based browser application builder ('browser-esbuild') is currently in developer preview and is not yet recommended for production use. For additional information, please see https://angular.io/guide/esbuild

Application bundle generation complete. [2.656 seconds]
(node:93724) ExperimentalWarning: VM Modules is an experimental feature. This feature could change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
 PASS  dist/test-out/app.component.spec.mjs
  AppComponent
    ✓ should create the app (32 ms)
    ✓ should have the 'Repro App' title (3 ms)
    ✓ should render title (3 ms)

=============================== Coverage summary ===============================
Statements   : 56.27% ( 52457/93208 )
Branches     : 70.64% ( 2513/3557 )
Functions    : 22.49% ( 1208/5369 )
Lines        : 56.27% ( 52457/93208 )
================================================================================

Test Suites: 1 passed, 1 total
Tests:       3 passed, 3 total
Snapshots:   0 total
Time:        1.375 s
Ran all test suites.

Output with "babel" coverageProvider:

NOTE: The Jest builder is currently EXPERIMENTAL and not ready for production use.
The esbuild-based browser application builder ('browser-esbuild') is currently in developer preview and is not yet recommended for production use. For additional information, please see https://angular.io/guide/esbuild

Application bundle generation complete. [2.376 seconds]
[BABEL] Note: The code generator has deoptimised the styling of ../dist/test-out/chunk-FZJ42BZ5.mjs as it exceeds the max of 500KB.
[BABEL] Note: The code generator has deoptimised the styling of ../dist/test-out/chunk-2TWXLREL.mjs as it exceeds the max of 500KB.
(node:93806) ExperimentalWarning: VM Modules is an experimental feature. This feature could change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
 PASS  dist/test-out/app.component.spec.mjs (8.787 s)
  AppComponent
    ✓ should create the app (46 ms)
    ✓ should have the 'Repro App' title (7 ms)
    ✓ should render title (9 ms)

=============================== Coverage summary ===============================
Statements   : 25.74% ( 7742/30068 )
Branches     : 16.38% ( 2946/17978 )
Functions    : 25.9% ( 1743/6728 )
Lines        : 26.06% ( 7635/29296 )
================================================================================

Test Suites: 1 passed, 1 total
Tests:       3 passed, 3 total
Snapshots:   0 total
Time:        9.871 s
Ran all test suites.

Your Environment

Angular CLI: 16.0.3
Node: 16.19.1
Package Manager: pnpm 8.5.1
OS: darwin arm64

Angular: 16.0.3
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1600.2
@angular-devkit/build-angular   16.0.3
@angular-devkit/core            16.0.2
@angular-devkit/schematics      16.0.2
@schematics/angular             16.0.2
rxjs                            7.8.1
typescript                      5.0.4

Anything else relevant?

dist/test-out/coverage/index.html

repro-app repo

maximLyakhov commented 1 year ago

Is further support for Jest features integration planned in the v16? It looks like most of the job is done. Also there is no official docs on Angular + Jest except the blog post.

dgp1130 commented 1 year ago

Code coverage isn't supported yet, but once we get there we'll need to make sure it reports stats for the raw source files.

Actually custom config files aren't supported either, so I'm surprised it actually respects the jest.config.mjs at all. We should probably introduce an error or at least ensure that Jest is pointed at a generated config file.

f-aubert commented 9 months ago

did anything change with angular17? or did I miss something? thx

angular / angular-cli