Testing Angular Pragmatique

• Développeurs Angular

• Maîtriser le coût des tests et adopter une stratégie de testing pragmatique et rentable
• Implémenter des tests pour vos applications Angular avec l'approche Test-Driven Development
• Choisir le bon type de tests à implémenter en fonction du contexte
• Découpler les tests du code pour faciliter le refactoring
• Implémenter des tests maintenables et compréhensibles
• Implémenter des tests type-safe
• Utiliser efficacement Vitest, Testing Library, et Playwright Component Testing

Introduction au testing

• Pourquoi tester ?
• Qu'attendre des tests ?
• Le "Development Time Perception Bias"
• Les différents types de test : Narrow & Wide vs. Unit & Integration

Vitest

• Pourquoi Vitest au lieu de Karma, Jest ou Web Test Runner ?
• Avantages et inconvénients

Premier Test

• Prise en main des outils
• Exercice : Tester un service Angular avec l'approche Progressive TDD
• Exercice : Debugging avec Vitest

Test-Driven Development

• Origines et intérêt du Test-Driven Development
• Progressive TDD
• Astuces et bonnes pratiques

Timeboxed TDD & TCR

• Refactor vs. Restructure: retour aux définitions
• Timeboxed TDD
• Limbo
• TCR : Test && Commit || Revert

Async Testing

• Tester du code asynchrone
• Exercice : Tester des observables
• Exercice : Tester des "effects"
• Fake timer

Component Testing

• Tester un composant
• Les différents types de tests de composant : Isolated vs. Shallow vs. Integration
• Interaction avec le DOM
• Exercice : Shallow testing
• Exercice : Integration testing

Test Doubles

• Mocks vs Spies vs Stubs vs Fakes
• "Fake it till you Mock it"
• Écrire des tests type-safe
• Choisir la bonne approche pour "overrider" l'injection de dépendance Angular
• Exercice : Simuler le comportement d'une dépendance avec Mocks, Spies & Stubs
• Exercice : Remplacer une dépendance avec un Fake
• Utiliser des "contract tests" pour s'assurer que les Fakes restent symétriques

Plus de Component Testing

• Exercice : Test des inputs / outputs
• Exercice : Interaction avec les formulaires

Angular & DOM Testing Library

• Tester le DOM de façon résiliente
• Exercice : Angular Testing Library

Gloves & Angular CDK Test Harness

• Concept de "Gloves", ou comment préserver vos tests des détails d'implémentation
• L'histoire d'Angular CDK Test Harness
• Quand et comment utiliser un Test Harness
• Exercice : Utilisation d'un test harness
• Exercice : Implémentation d'un test harness

UI Testing avec Playwright Component Testing

• Les limites du testing "browserless"
• Vitest browser mode vs. Playwright Component Testing
• Exercice : UI testing avec Playwright Component Testing
• Exercice : Debugging avec Playwright Component Testing

Visual Regression Testing

• Tester la présentation
• Détecter les régressions visuelles avec Playwright Component Testing

Concevoir une Stratégie de Testing Pragmatique

• Objectifs d'une stratégie de testing
• Choisir ce qu'il faut tester et comment le tester
• Évaluer une stratégie de testing
• Comment introduire du testing dans du codebase legacy ?

Une attestation de participation sera transmise aux participants