I recently updated the @angular-builders/jest
from 7 to 8. In the migration guide it states that I should remove @types/jest
because it's now comes with Jest v24. (I also updated my tsconfig)
So far so good.
But now my tests fail with
error TS2304: Cannot find name 'jest'.
jest.mock('src/app/omitted');
error TS2304: Cannot find name 'jest'.
jest.clearAllMocks();
And VS Code will have nothing to do with jest global variable. Which sort of make sense as I removed typeRoots from my tsconfig as I should according to the migration guide.
In tsconfig.json (root directory, used by IDE):
Remove typeRoots array
Again, since Jest typings are packaged inside jest package and are not located under node_modules/@types you don't want the type roots to be limited to a specific folder.
But what gives? The migration guide says I should remove @types/jest
but how do I make it play nice with jest.mock
and jest.clearAllMocks
again?
I tried:
import { mock } from 'jest'; // mock isn't found
import * as jest from 'jest'; // jest.mock isn't found
Please advice.
Here are my configs (same as the simple-app example)
relevant dev packages
{
"@angular-builders/jest": "^8.0.3",
"jest": "^24.8.0",
"jest-preset-angular": "^7.1.1",
"ts-jest": "^24.0.2",
}
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "esnext",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es2015",
"lib": ["es2018", "dom"],
"strict": true // note strict mode
}
}
tsconfig.spec.json
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/spec",
"allowJs": true
},
"files": ["src/polyfills.ts"],
"include": ["src/**/*.spec.ts", "src/**/*.d.ts"]
}
angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"my-project": {
//...
"architect": {
//...
"test": {
"builder": "@angular-builders/jest:run",
"options": {}
}
}
}
}
}
@types/jest
is apparently still needed. The migration guide have been adjusted to reflect this.
The configs look like this now:
package.json
"@angular-builders/jest": "^8.0.3",
"@types/jest": "^24.0.15",
"jest": "^24.8.0",
"jest-preset-angular": "^7.1.1",
"ts-jest": "^24.0.2",
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "esnext",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es2015",
"lib": ["es2018", "dom"],
"types": ["jest"],
"strict": true // note strict mode, this isn't default
}
}
tsconfig.spec.json
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/spec"
},
"files": ["src/polyfills.ts"],
"include": ["src/**/*.spec.ts", "src/**/*.d.ts"]
}