Unit Testing JavaScript/TypeScript in AEM with Jest | AEM Community Blog Seeding

[kautuk_sahni]

Unit Testing JavaScript/TypeScript in AEM with Jest by 3sharecorp

Abstract

When there are tight timelines to meet, writing JS tests seems like unnecessary overhead. However, its benefits - identifying bugs earlier in the Software Development Life Cycle (SDLC), improving code quality and ensuring that code will fulfill its intended purpose if updated later - far outweigh the time invested implementing them.

Below I will outline the setup we did for one of our projects at 3|SHARE to implement JS unit testing using Jest and Babel.

Prerequisites
For the setup below, you'll need a project directory housing the AEM Archetype with the ui.frontend module available.

I recommend you use NodeJS v14.16.0+, and, ensure the frontend-maven-plugin reflects this in the root pom.xml so the correct version is picked up by the maven build.

...
com.github.eirslett
frontend-maven-plugin
1.11.3

v14.16.0
6.14.11

...
Setup
We opted to use Jest because of its popularity and ability to integrate with many popular libraries.
First, make sure you have included Jest (and if using TS, the appropriate types are installed so TS can understand Jest syntax) as part of the ui.frontend module.
As Jest supports using TS through Babel, add the appropriate Babel presets (@babel/preset-env / @babel/preset-typescript ):

npm install jest --save-dev
npm install @types/jest --save-dev
npm install @babel/preset-env --save-dev
npm install @babel/preset-typescript --save-dev

Read Full Blog

Unit Testing JavaScript/TypeScript in AEM with Jest

Q&A

Please use this thread to ask the related questions.