Formation Vitest

Description

Cette formation Vitest vous permettra d’acquérir des compétences approfondies pour tester vos applications avec un outil performant et adapté à Vite.

Au cours de cette journée, vous apprendrez à :

• configurer un environnement de test robuste avec Vitest (via npm, yarn ou pnpm)
• exploiter son support natif de l’ESM pour concevoir des tests rapides et fiables
• rédiger des tests unitaires précis pour des fonctions ou des composants React et Vue
• simuler des interactions complexes et des appels API, et à
• maîtriser les mocks et spies.

Vous optimiserez également vos processus de test grâce au mode watch, à l’exécution parallèle et aux rapports de couverture.

Enfin le fil rouge des mises en pratique de la formation, vous amènera à construire une suite de tests robuste pour une application existante.

Public

Cette formation s’adresse aux développeur·euse·s front-end de tous niveaux et souhaitant tester efficacement leurs applications web avec Vitest.

Les objectifs

• Comprendre les concepts fondamentaux de Vitest
• Comparer Vitest avec d’autres outils comme Jest et Mocha
• Mettre en place un environnement de test performant avec Vitest
• Écrire des tests unitaires et d'intégration
• Gérer les mocks et les spies
• Optimiser les tests pour améliorer les performances

Pré-requis

• Bonne connaissance de JavaScript et TypeScript
• Expérience avec un framework front-end (React, Vue, Svelte, etc.)
• Familiarité avec des outils comme npm, yarn ou pnpm
• Ordinateur portable à apporter

Le programme de la formation Vitest

• Introduction à Vitest
  • Pourquoi un nouvel outil de test ?
  • Problèmes des solutions traditionnelles (Jest, Mocha…)
  • Points forts et avantages de Vitest
    • rapidité
    • compatibilité avec Vite
    • ESM natif
  • Installation et configuration de base
• Mise en place d’un projet de test avec Vitest
  • Installation avec npm/yarn/pnpm
  • Structure et configuration d’un projet de test (vite.config.js + vitest.config.ts)
  • Comparaison entre exécution en CLI et intégration avec un projet Vite
  • Utilisation des matchers et principes de base de Vitest
• Écriture des premiers tests
  • Test d’une fonction simple
  • Utilisation des assertions et des expect
  • Groupement de tests avec describe
  • Hooks de test
    • beforeEach, afterEach, beforeAll, afterAll
• Tests avancés et bonnes pratiques
  • Utilisation des mocks et spies
    • vi.mock, vi.fn
  • Tests asynchrones avec async/await et done
  • Tests avec snapshot testing
  • Gestion des erreurs et tests de rejets
    • rejects, throws
• Vitest et les frameworks front-end
  • Tests unitaires avec React
    • Test de composants avec @testing-library/react
    • Simuler des événements utilisateur
    • Mocking des hooks et du contexte
  • Tests unitaires avec Vue
    • Utilisation de @vue/test-utils
    • Tester des composants avec des props et des événements
  • Gestion du DOM et rendu virtuel
• Optimisation et exécution des tests
  • Exécution en mode watch (vitest --watch)
  • Tests en mode parallèle et gestion du cache
  • Intégration avec ESLint et Prettier
  • Générer des rapports et couverture de test avec --coverage

Mises en pratique :

• Mettre en place un environnement de test
• Écrire des tests pour des fonctions utilitaires
• Tester un composant React/Vue avec interactions utilisateur
• Simuler un appel API et tester un comportement asynchrone
• Résolution de problèmes courants et debugging

Télécharger le programme

Formations associées

• 

  Software Craftsmanship Front-End

  2 jours
• 

  Cypress

  2 jours
• 

  Claude Code

  2 jours
• 

  Playwright

  2 jours
• 

  Vite

  1 jour
• 

  React Avancé

  3 jours

Formateur

Emmanuel DEMEY

Emmanuel est consultant et formateur depuis 2009. Spécialisé dans les technologies Web et également sur la suite Elastic, il donne des formations depuis une dizaine d’années.

Toujours prêt à partager ces connaissances, il donne depuis cinq ans de nombreuses conférences en France et co-gère également l’association du GDG Lille, organisant la conférence Devfest Lille. Il est également intervenant à l’IMT Lille-Douai depuis 2019.

Aujourd’hui, Emmanuel intervient chez ces clients pour des missions d’expertise et de réalisation en apportant tout d’abord son experience sur les problématiques de qualité, maintenabilité, accessibilité et performance.

FAQ

8 raisons de participer à une formation Human Coders

• Satisfaction client élevée : Un taux de satisfaction de 4,6/5 depuis 2012 (sur 1981 sessions réalisées). 99% des participants se disent satisfaits de nos formations
• Approche pédagogique unique : Des formations en petit groupe, des formateurs passionnés et expérimentés, de véritables workshops... (Plus d'infos sur notre manifeste)
• Catalogue de formations complet : 285 formations au catalogue, de quoi vous accompagner sur tout vos projets
• Écosystème dynamique : Nous accompagnons les dev depuis 14 ans avec des initiatives comme Human Coders News, les Human Talks, le podcast ou encore notre serveur Discord
• Financement facilité : Organisme certifié Qualiopi, indispensable pour que vous puissiez obtenir des aides au financement via votre OPCO
• Références clients prestigieuses : De nombreux clients qui nous font confiance depuis des années
• Accompagnement sur mesure : Nous vous proposons un accompagnement personnalisé par nos consultants pour vous aider dans vos projets au-delà de la formation
• Valorisation professionnelle : Remise d'un diplôme, d'une attestation et d'une certification, suivant les formations effectuées, que vous pourrez afficher sur vos CV et réseaux sociaux