Configuring Jest with Angular 10+

jest-in-angular.txt

package.json

  "jest": {
    "testEnvironment": "jsdom"
  }

install latest version of Jest

"test": "ng test",
"test-watch": "ng test --watch",

jest.config.js

// https://github.com/thymikee/jest-preset-angular#brief-explanation-of-config
module.exports = {
    preset: 'jest-preset-angular',
    roots: ['src'],
    moduleNameMapper: {
      '@app/(.*)': '<rootDir>/src/app/$1',
      '@assets/(.*)': '<rootDir>/src/assets/$1',
      '@core/(.*)': '<rootDir>/src/app/core/$1',
      '@env': '<rootDir>/src/environments/environment',
      '@src/(.*)': '<rootDir>/src/$1',
      '@state/(.*)': '<rootDir>/src/app/state/$1'
    },
    transformIgnorePatterns: ['node_modules/(?!(jest-test))'],
    testMatch: [
      "**/*.spec.ts"
    ],
    globals: {
      'ts-jest': {
        diagnostics: false,
        tsconfig: '<rootDir>/tsconfig.spec.json'
      }
    }
  };

angular.json

        "test": {
          "builder": "@angular-builders/jest:run"
        },
        
tsconfig.json
    "types": ["jest"],