Skip to content

Instantly share code, notes, and snippets.

@bhubr
Last active May 29, 2022 09:28
Show Gist options
  • Save bhubr/3e42b22957b1fed1c57efd98ac734ea1 to your computer and use it in GitHub Desktop.
Save bhubr/3e42b22957b1fed1c57efd98ac734ea1 to your computer and use it in GitHub Desktop.
Mise en place d'un projet TS avec Jest

Mise en place d'un projet TS avec Jest

Installation

1. Initialiser le projet

Utiliser Git Bash ou WSL (sinon faire le .gitignore manuellement)

Créer un répertoire ts-with-jest, initialiser le package.json, le dépôt Git, le fichier .gitignore :

mkdir ts-with-jest
cd ts-with-jest
npm init --yes
git init
echo node_modules >> .gitignore

2. Installer les dépendances

Toujours dans le même répertoire, ici avec Yarn (préalablement installé avec npm i -g yarn) :

yarn add --dev typescript jest ts-jest @types/jest

3. Initialiser TypeScript

Ceci va générer le tsconfig.json :

npx tsc --init

4. Initialiser la config pour Jest

ts-jest va ici être utilisé pour initialiser le fichier jest.config.js, paramétré pour faciliter l'utilisation de Jest avec TypeScript.

npx ts-jest config:init

5. Configurer le package.json

Changer la ligne suivante du package.json :

"test": "echo \"Error: no test specified\" && exit 1"

En :

"test": "jest --watchAll"

6. Commit !

git add .
git commit -m"Initialize project with TypeScript & Jest"

Ecriture de tests

On va écrire des tests "unitaires" : permettent de tester une "unité" telle qu'une fonction, une classe, un composant...

On va souvent trouver un fichier de test .test.ts pour un fichier .ts. Par exemple, on va écrire un fichier foo.test.ts contenant :

// src/foo.test.ts

// On importe la fonction à tester
import foo from './foo';

// describe() permet de définir une "suite" de tests
describe('function foo', () => {
  // it() permet de définir UN test
  it('when given a positive number, returns it', () => {
    // expect() va permettre de définir des "expectations" (attentes)
    // on s'attend à ce que foo(15) renvoie 15
    expect(foo(15)).toBe(15);
  });

  // Un autre test
  it('when given a negative number, throws an error', () => {
    expect(() => foo(-10)).toThrow();
  });
});

Ecriture du code à tester

Dans le fichier src/foo.ts, écrire une fonction qui :

  • prend un nombre un paramètre
  • renvoie ce nombre s'il est positif (ou nul)
  • "throw" une erreur s'il est négatif

Il faut bien sûr exporter cette fonction.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment