Angular 13 + jest + Angular library not working

Question

I'm trying to use jest in an Angular 13 project for testing. I use jest-preset-angular with @angular-builders/jest.

I use ngx-pipes, which is a library that is not compiled for Angular 13. It works fine during normal Angular build. But in the jest test run it causes the error:

Error: Unexpected value 'NgStringPipesModule2' imported by the module 'DynamicTestModule'. Please add an @NgModule annotation.

Minimal reproduction: https://github.com/dhcode/jest-preset-angular-13-issue

In my actual project I have the same error also with other Angular libraries. I ran ng serve before, so the ngcc compilation was done before running the tests.

How can I make my tests run and recognize the external libraries, that have been built with an older Angular version?

score 6 · Accepted Answer · answered Jan 15 '22 at 05:24

From the looks of it, ngx-pipes does not yet publish an Ivy distribution and your project still needs ngcc before running the tests.

// package.json
{
  "scripts": {
    "test": "ngcc && ng test"
  }
}

> jest-tests@0.0.0 test
> ngcc && ng test

Processing legacy "View Engine" libraries:
- ngx-pipes [fesm2015/esm2015] (https://github.com/danrevah/ngx-pipes.git)
- ngx-pipes [esm2015/esm2015] (https://github.com/danrevah/ngx-pipes.git)
- ngx-pipes [main/umd] (https://github.com/danrevah/ngx-pipes.git)
Encourage the library authors to publish an Ivy distribution.
 PASS  src/app/app.component.spec.ts
  AppComponent
    ✓ should create the app (163 ms)
    ✓ should have as title 'jest-tests' (46 ms)
    ✓ should render title (44 ms)
    ✓ should render shortened text (33 ms)

-------------------|---------|----------|---------|---------|-------------------
File               | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s 
-------------------|---------|----------|---------|---------|-------------------
All files          |     100 |      100 |     100 |     100 |                   
 ...component.html |     100 |      100 |     100 |     100 |                   
 app.component.ts  |     100 |      100 |     100 |     100 |                   
-------------------|---------|----------|---------|---------|-------------------
Test Suites: 1 passed, 1 total
Tests:       4 passed, 4 total
Snapshots:   0 total
Time:        3.526 s, estimated 5 s
Ran all test suites.

Angular 13 + jest + Angular library not working

1 Answers1