TDD en TypeScript : écris du code sans peur et sans reproche

Arrête de deviner : pourquoi le TDD n'est pas du masochisme, mais un super-pouvoir

Imagine : tu écris du code. Tout fonctionne. Tu es content. Un mois plus tard, tu reviens sur le projet, tu fais un petit changement — et tout casse. Ça te dit quelque chose ? Maintenant imagine que tu as un filet de sécurité qui attrape chaque erreur en une seconde. C'est ça, le TDD en TypeScript — le développement piloté par les tests.

Beaucoup de développeurs pensent que le TDD est réservé aux perfectionnistes ou aux projets de la NASA. Spoiler : ce n'est pas le cas. Le Test Driven Development est un outil qui fait gagner des heures de débogage, améliore la qualité du code et rend le refactoring sûr. Dans cet article, nous allons décortiquer le TDD TypeScript avec des exemples concrets, sans blabla ni abstractions.

Si tu codes en TypeScript et que tu veux arrêter d'avoir peur de tes propres modifications — continue à lire. Ça va être intéressant.

Qu'est-ce que le TDD (et pourquoi ce n'est pas juste "écrire des tests")

Le TDD (Test-Driven Development) est une méthodologie où les tests sont écrits avant le code. Ça semble fou ? Seulement à première vue. Le cycle TDD se compose de trois étapes :

\n
1. Rouge (Red) — écris un test qui échouera forcément, car le code n'existe pas encore.
\n
2. Vert (Green) — écris le code minimal pour que le test réussisse.
\n
3. Refactoring (Refactor) — améliore le code sans changer son comportement.
\n

Et ainsi de suite — en boucle. Chaque nouvelle fonctionnalité commence par un test. Cela discipline, oblige à réfléchir à la conception de l'API à l'avance et donne la certitude que tout fonctionne comme sur des roulettes.

D'ailleurs, les tests unitaires TypeScript ne sont pas qu'une simple "vérification de fonctions". C'est de la documentation, une spécification et une assurance tout-en-un.

Outils pour le TDD en TypeScript : ce qu'il faut installer

Pour tester TypeScript, nous aurons besoin de :

\n
• Jest — le framework de test le plus populaire. Fonctionne directement avec TypeScript.
\n
• ts-jest — un preset pour Jest afin qu'il comprenne TypeScript sans configuration supplémentaire.
\n
• @types/jest — les types pour l'autocomplétion dans l'IDE.
\n

Installation en une commande :

npm install --save-dev jest ts-jest @types/jest typescript

Ajoute dans package.json le script pour lancer les tests :

"scripts": {\n  "test": "jest",\n  "test:watch": "jest --watch"\n}

Maintenant, tout est prêt pour le développement piloté par les tests en TypeScript.

Écrire notre premier test en TDD : du rouge au vert

Imaginons que nous devons écrire une fonction qui vérifie si une chaîne est un palindrome. Selon la méthode TDD classique — on commence par le test.

Étape 1. Rouge (Red)

Créons le fichier isPalindrome.test.ts :

import { isPalindrome } from './isPalindrome';\n\ndescribe('isPalindrome', () => {\n  it('doit retourner true pour la chaîne "racecar"', () => {\n    expect(isPalindrome('racecar')).toBe(true);\n  });\n\n  it('doit retourner false pour la chaîne "hello"', () => {\n    expect(isPalindrome('hello')).toBe(false);\n  });\n});

Lançons le test :

npm test

Nous voyons une erreur : Cannot find module './isPalindrome'. Parfait, la phase rouge est réussie. Maintenant, nous devons écrire le code pour que le test réussisse.

Étape 2. Vert (Green)

Créons isPalindrome.ts avec une implémentation minimale :

export function isPalindrome(str: string): boolean {\n  return str === str.split('').reverse().join('');\n}

Relançons les tests — vert ! Les deux tests passent. Mais ce n'est pas tout.

Étape 3. Refactoring (Refactor)

Notre fonction fonctionne, mais il y a un détail : elle ne gère pas les chaînes avec des espaces ni la casse. Ajoutons un nouveau test :

it('doit ignorer la casse et les espaces',