Marmicode

Formation Test React Pragmatique

3 Jours · Online

🐣 Early Bird à partir de 970 € HT

Trois jours pour transformer le chaos des tests en une stratégie bien assaisonnée. Construisez des tests qui résistent au refactoring, aux migrations et aux deadlines.

🇫🇷 Formation finançable jusqu'à 100% via OPCO.

🍱 Ce que vous apprendrez

Test-Driven Development

De la spécification au refactoring, apprenez à penser TDD.

Outils de Test Modernes

Maîtrisez le meilleur de Vitest, Vitest Browser Mode et Playwright Component Testing avec Testronaut.

Tests Lisibles et Maintenables

Tests qui décrivent le comportement, pas des détails d'implémentation.

Des Tests à l'Épreuve du Temps

Concevez des tests qui résistent aux migrations et au refactoring avec un minimum de changements.

Le Mocking en toute Simplicité

Maîtrisez les Fakes et les Object Mothers pour simplifier le "mocking" et éviter les pièges habituels.

Tests End-to-End

Écrivez des tests end-to-end fiables avec Playwright et sachez comment choisir l'outil approprié.

Buffet de Tests Pragmatiques

Profitez d'un buffet de conseils et de techniques pour adopter une stratégie de test pragmatique.

Stratégie de Test à l'Ère de l'IA

Adaptez votre stratégie au développement assisté par IA.

💬 Retour des participants

Super formateur, très dynamique et très compétent sur le sujet, merci !

Bastien M.

Très intéressant, Younes connaît parfaitement son sujet et anime très bien la formation. J'ai beaucoup apprécié

Sylvain L.

Excellent formateur - passionné par le sujet.

Benoit B.

🗓️ Programme

  • Pourquoi tester ?
  • Qu'attend-on d'un test ?
  • Le biais de perception du temps de développement.
  • Les différents types de tests : Narrow & Wide vs Unit & Integration.
  • Pourquoi Vitest plutôt que Jest, Mocha ou Web Test Runner.
  • Avantages et inconvénients.
  • Conseils et astuces pour des tests précis et maintenables.
  • Object Mothers.
  • Créer des données de test réutilisables.
  • Réduire la duplication dans les tests.
  • Tests asynchrones.
  • Tester les mises à jour de state et les "effects".
  • Tester les hooks asynchrones (ex. : React Query de Tanstack).
  • Pratique des tests asynchrones.
  • Mocks vs Dummies vs Spies vs Stubs vs Fakes.
  • Fake it till you Mock it!
  • Tests "type-safe".
  • Contract testing de "fakes".
  • Pratique des Test Doubles.
  • Tester un composant.
  • Les différents types de tests de composants : isolated vs. shallow vs. integration.
  • Interagir avec le DOM.
  • Tests "isolated" de composants.
  • Tests "shallow" de composants.
  • Tests d'"intégration" de composants.
  • Tests DOM résilients.
  • Tests dans un vrai navigateur.
  • Pratique React Testing Library.
  • Pratique Vitest Browser Mode.
  • Compromis entre Browser Mode « Partial » et « Full ».
  • Test-Driven Development : origine et bénéfices.
  • TDD progressif.
  • Tester un custom hook React avec l'approche TDD progressif.
  • Debug avec Vitest.
  • Refactor vs. Restructure : retour aux définitions.
  • TDD timeboxé.
  • Limbo.
  • TCR : Test && Commit || Revert.
  • Tester les props des composants.
  • Tester les callbacks des composants.
  • Tester la communication via Props et Callbacks.
  • Interagir avec les formulaires.
  • Utiliser les "fake timers".
  • Avancer le temps rapidement.
  • Tester un comportement dépendant du temps.
  • Gloves.
  • Le pattern Page Object pour les composants React.
  • Quand et comment les utiliser.
  • Utiliser un Page Object.
  • Implémenter un Page Object.
  • Tester la logique de routage.
  • Tester les data loaders et les routes protégées.
  • Tester les flux de navigation.
  • Quand utiliser les tests e2e vs. les tests de composants.
  • Écrire des tests end-to-end rapides et fiables avec Playwright.
  • Pratique des tests end-to-end avec Playwright.
  • Au-delà des limites du testing sans navigateur.
  • Playwright Component Testing avec Testronaut.
  • Debug avec Playwright et Testronaut.
  • Pratique Playwright Component Testing avec Testronaut.
  • Tester la présentation.
  • Tests de régression visuelle : magie, pièges, recommandations et stratégies.
  • Détecter les régressions visuelles avec Playwright et Testronaut.
  • Objectifs d'une stratégie de test.
  • Choisir quoi tester et comment.
  • Évaluer une stratégie de test.
  • Introduire les tests dans une base de code legacy.
  • Ce qui change — et ce qui ne change pas — quand les agents écrivent le code ou les tests.
  • Les tests comme boucle de feedback pour l'agent vs. comme filet de sécurité pour les humains — et pourquoi ces deux rôles tirent la même suite dans des directions différentes.
  • Les défis du développement assisté par IA : Cognitive Debt, Review Fatigue et Context Switching Tax — et comment une stratégie de test solide les contient.
  • Quoi choisir et quand : Vibe Coding vs. Spec-Driven Development vs. Charted Coding.

🎓 Prérequis

  • Concepts fondamentaux de React (ex. : composants, props, state, hooks, context)
  • Fondamentaux TypeScript (ex. : types, interfaces, génériques basiques)
  • Fondamentaux Git (ex. : cloner, réinitialiser les changements locaux, changer de branche)

👨🏻‍🏫 Votre formateur

Younes Jaaidi wearing a red apron and holding wooden cooking spoons, standing in a kitchen-themed setup with jars of fairy lights and programming stickers (JavaScript, TypeScript, Angular, Nx, RxJS) on a shelf behind him.
Google Developer Expert badge

Younes Jaaidi

I am a Software Cook who enjoys whipping code until tests pass.

With nearly 20 years of experience in eXtreme Programming, I've coached dozens of teams and trained thousands of developers to cook robust and maintainable software — using Test-Driven Development, pragmatic testing strategies, and a healthy dose of Collective Ownership.

I'm also an Angular Google Developer Expert, an NX Champion, and a mediocre sailor.

🙋 Foire aux questions

Aux développeurs React qui écrivent déjà des tests — ou qui veulent s'y mettre — et qui souhaitent améliorer leurs pratiques de test. Que vous soyez confrontés à des tests instables, du code difficile à tester, ou une absence de stratégie de test — cette formation est faite pour vous.

Vous devez être à l'aise avec les fondamentaux de React (composants, props, state, hooks), les bases de TypeScript, et Git. Aucune expérience préalable en testing n'est nécessaire — on part de zéro.

Un ordinateur portable avec Node.js, Git, et votre IDE préféré. Les instructions de setup sont envoyées quelques jours avant la formation.

Très. Vous alternerez entre courtes sessions théoriques et exercices pratiques pendant trois jours. Les petits groupes garantissent un accompagnement direct et personnalisé.

Les principes et stratégies enseignés s'appliquent quel que soit votre test runner. Cela dit, on utilise Vitest dans les exercices — et vous risquez de ne plus vouloir revenir en arrière.

Si vous êtes en France, cette formation est éligible au financement OPCO. Contactez-moi pour un devis et les modalités administratives.

"Réserver une Place" vous inscrit à une session planifiée. "Session sur Mesure" s'adresse aux entreprises qui souhaitent une formation privée — avec la possibilité d'adapter le contenu, la durée ou les priorités.

Si la formation ne répond pas à vos attentes, contactez-moi dans les 7 jours et nous trouverons une solution ensemble.