Skip to main content
Version: 14.3

Options

jest-preset-angular uses ts-jest options under the hood, which are located under the transform of Jest config object in the package.json file of your project, or through a jest.config.js, or jest.config.ts file.

More information about ts-jest options, see doc

important

Since v9.0.0, jest-preset-angular default Jest configuration no longer provides moduleNameMapper. If you wish to reuse the old moduleNameMapper configuration, you can put this into your Jest config.

// jest.config.js
module.exports = {
//...
moduleNameMapper: {
'^src/(.*)$': '<rootDir>/src/$1',
'^app/(.*)$': '<rootDir>/src/app/$1',
'^assets/(.*)$': '<rootDir>/src/assets/$1',
'^environments/(.*)$': '<rootDir>/src/environments/$1',
},
};

Processing with esbuild

Since v11.0.0, jest-preset-angular introduced the usage of esbuild to process files besides TypeScript API. By default, all .mjs files will be processed by esbuild in jest-preset-angular. To configure extra files to process with esbuild, one can do the following:

// jest.config.js
module.exports = {
//...
globals: {
ngJest: {
processWithEsbuild: [<glob_to_files>],
},
},
}

Exposed configuration

// jest.config.js
const snapshotSerializers = require('jest-preset-angular/build/serializers');

module.exports = {
moduleFileExtensions: ['ts', 'html', 'js', 'json', 'mjs'],
resolver: 'jest-preset-angular/build/resolvers/ng-jest-resolver.js',
snapshotSerializers,
testEnvironment: 'jsdom',
transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
transform: {
'^.+\\.(ts|js|mjs|html|svg)$': [
'jest-preset-angular',
{
tsconfig: '<rootDir>/tsconfig.spec.json',
stringifyContentPathRegex: '\\.(html|svg)$',
},
],
},
};
important

Jest runs with jest-preset-angular neither in browser nor through dev server. It uses JSDOM to abstract browser environment hence we depend on JSDOM implementation for real browser features.

Brief explanation of config

  • We're using "transform" to pass information about configuration to use for code compilation with ts-jest.
  • "moduleFileExtensions" – our modules are TypeScript (ts), HTML (html), JavaScript (js), JSON (json) and ESM JavaScript (mjs) files.
  • "moduleNameMapper" – if you're using absolute imports here's how to tell Jest where to look for them; uses RegExp.
  • "resolver" - instruct Jest how to resolve entry file based on package.json definitions.
  • "snapshotSerializers" - array of serializers which will be applied to snapshot the code. See more in Snapshot testing
  • "testEnvironment" – the test environment to run on.
  • "transformIgnorePatterns": instruct Jest to transform any .mjs files which come from node_modules.
  • "transform" – run every TS, JS, MJS, HTML, or SVG file through so called Jest transformer; this lets Jest understand non-JS syntax.