Angular 13+ Configure Jest Testing

angular-jest-installation.md

Angular testing con JEST

1. Remover cualquier referencia de Jasmine / Karma en el package.json

npm remove <karma karma-chrome-launcher...>

2. Instalar Jest

npm install --save-dev jest jest-preset-angular @types/jest

3. Crear el setup-jest.ts en la carpeta root del proyecto y el contenido es el siguiente

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

4. Agregar en el package.json, la configuración de Jest

"jest": {
    "preset": "jest-preset-angular",
    "setupFilesAfterEnv": [
      "<rootDir>/setup-jest.ts"
    ],
    "globalSetup": "jest-preset-angular/global-setup"
  }

4. Configurar JEST en tsconfig.json y tsconfig.spec.json

"types": [
  "jest"
]

5. Configurar los comandos para ejecutar las pruebas en el package.json

"test": "jest",
"test:watch": "jest --watchAll",

6. Remover karma.config.js y el archivo test.ts

Fernando no sé si te diste cuenta pero hay una configuración en el angular.json en el objeto test donde aún hay código de Karma, que se debería hacer en ese caso?

Fernando no sé si te diste cuenta pero hay una configuración en el angular.json en el objeto test donde aún hay código de Karma, que se debería hacer en ese caso?

Puedes eliminarlo, ya que está configurado para ser usado con ng test que lanzaría karma/jasmine.

@Klerith El curso de [Angular + Jest] de youtube ya no está en planes de continuarlo, ya sea ahí mismo o como un curso de pago?