DEV Community

Angular 11 - Setting up Jest

Alfredo Perez on July 06, 2020

This is a quick guide to setup Jest in your new Angular 10 application 1. Install Jest npm install jest @types/jest jest-preset-angu...
Collapse
 
dromerodev profile image
Diego Romero • Edited

[03/2021] For remove warnings:

  • update setupJest -> import 'jest-preset-angular/setup-jest';
  • add to tsconfig.json: "allowSyntheticDefaultImports": true,
  • update package.json -> tsConfig to tsconfig
Collapse
 
ushakovmaksym profile image
UMaks

ts-jestconfig The option tsConfig is deprecated and will be removed in ts-jest 27, use tsconfig instead

Collapse
 
muratkeremozcan profile image
Murat K Ozcan

what do we do about this one?

Collapse
 
ushakovmaksym profile image
UMaks • Edited

write tsconfig in lower case, don't use camel case style

Collapse
 
edezekiel profile image
Edward Ezekiel

Thank you for posting this article! I just upgraded an Angular 9 app to Angular 10 and was running into errors using Jest. I tweaked my Jest configurations using the steps in this post and everything worked like a charm.

Collapse
 
meghanar121 profile image
Meghana Rajappa • Edited

I followed all the steps, i am getting below error:

zone-testing.js is needed for the async() test helper but could not be found.Please make sure that your environment includes zone.js/dist/zone-testing.js

Collapse
 
saluce65 profile image
saluce65

Change your setupJest.ts file to import 'jest-preset-angular/setup-jest';

Collapse
 
sutin1234 profile image
thinny

work for me. Thanks

Collapse
 
itsgratien profile image
gratien

Thank you! @saluce65

Collapse
 
mikel_hamer_50f46faf752f0 profile image
Mikel Hamer

I don't know who you are, but thank you

Collapse
 
non4me profile image
Vladimir Troyanenko

Why src/test.ts you remove in step 4. but use in steps 6 and 7?

Collapse
 
alfredoperez profile image
Alfredo Perez

Thanks! I will remove it =)

Collapse
 
dianjuar profile image
Diego Juliao • Edited

There is a way of having the builder/executor test but using jest instead?

It's the ultimate solution, otherwise you need to put several npm scripts for all projects/libraries on your workspace

Collapse
 
jijonivan profile image
Ivan Jijon • Edited

Very useful!
Thank you very much. I followed this guide for Angular: 12.2.8.

Collapse
 
yadavpriya73028 profile image
Yadav Priya

What version of Jest,@type/jest and jest-preset-angular is compatible with Angular 11?