0

So I have a working base Angular project, and some simple generated tests. I've added Jest, ts-jest and jest-preset-angular, and I can get the correct number of passing tests on running ng test.

I've tried various jest configs from the docs at https://jestjs.io/docs/ecmascript-modules

At this point, I believe:

  • I've correctly switched from Karma to Jest.
  • Jest can pick up my tests in source files.
  • Jest can execute those tests against compiled code.
  • Coverage in lcov is being run correctly (produces the HTML report that I want to use) from Jest...
  • ...but that the test data cannot be matched back to the original source files. <-- This is where I'm struggling.

I'm fairly sure I'm missing something basic.

setup-jest.ts and jest.config.js are both in the root directory.

setup-jest.ts

import 'jest-preset-angular/setup-jest';

jest.config.js

module.exports = {
  preset: 'jest-preset-angular/presets/defaults-esm',
  collectCoverage: true
};

I have also tried this (and variations of it):

module.exports = {
  //...
  extensionsToTreatAsEsm: ['.ts'],
  transform: {
    '^.+\\.(ts|js|html)$': [
      'jest-preset-angular',
      {
        tsconfig: '<rootDir>/tsconfig.spec.json',
        stringifyContentPathRegex: '\\.(html)$',
        useESM: true,
      },
    ],
  },
  collectCoverage: true,
};

Running the test coverage results in this HTML report:

Coverage report showing modules instead of Typescript components

Here's what I get in the console on running tests:

Application bundle generation complete. [2.348 seconds]
[BABEL] Note: The code generator has deoptimised the styling of C:\Repos\Workhelper-Mobile-Angular-v2\dist\test-out\chunk-K6UOHJLL.mjs as it exceeds the max of 500KB.
[BABEL] Note: The code generator has deoptimised the styling of C:\Repos\Workhelper-Mobile-Angular-v2\dist\test-out\chunk-K6UOHJLL.mjs as it exceeds the max of 500KB.
[BABEL] Note: The code generator has deoptimised the styling of C:\Repos\Workhelper-Mobile-Angular-v2\dist\test-out\chunk-DYCT7O7F.mjs as it exceeds the max of 500KB.
[BABEL] Note: The code generator has deoptimised the styling of C:\Repos\Workhelper-Mobile-Angular-v2\dist\test-out\chunk-DYCT7O7F.mjs as it exceeds the max of 500KB.
(node:34680) ExperimentalWarning: VM Modules is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
 PASS  dist/test-out/todo-repository.component.spec.mjs (14.183 s)
(node:6928) ExperimentalWarning: VM Modules is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
 PASS  dist/test-out/app.component.spec.mjs (14.809 s)
File                | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s                                                                                  
All files           |   29.46 |    20.74 |   26.22 |   29.71 |                                                                                                    
 chunk-DE2EG6WR.mjs |   23.82 |     6.45 |   14.13 |   24.13 | 104,112,117-175,185-219,223,231,236-279,289,298-352,361,370-541,558-582,648-707,711-766,774-781,812-1044,1051-1077,1082-1349,1361-1612,1623-1639,1643-1660,1670-1684,1690-1784,1800,1810-1868,1883-1899,1903-1918,1927-2036,2049-2061,2065-2124,**SNIP**,32983,32989-32992
 chunk-K6UOHJLL.mjs |   43.91 |    34.04 |   39.34 |   44.37 | 14-15,25-41,62,76-81,93,95,114-115,121-125,147-148,151,169-175,**SNIP**,21363,21366-21371,21379-21388,21413-21429,21434-21441,21469-21477,21494-21500                                                                                                                            

Test Suites: 2 passed, 2 total
Tests:       4 passed, 4 total
Snapshots:   0 total
Time:        19.137 s
Ran all test suites.
frackham
  • 406
  • 4
  • 15

0 Answers0