Configurer Playwright dans SvelteKit
Installez et configurez Playwright pour un projet SvelteKit avec l’intégration officielle.
Configurer Playwright dans SvelteKit est une leçon Sveltejs Academy gratuite sur CoddyKit. Ceci est la leçon 1 sur 4. Tu peux lire la leçon complète ci-dessous gratuitement — puis la pratiquer en direct dans le navigateur avec un éditeur de code intégré et un tuteur IA 24/7. Elle fait partie du parcours d'apprentissage Sveltejs Academy, et ta progression se synchronise sur le web et l'application CoddyKit. Le cours Sveltejs Academy comprend 4 leçons au total.
Qu'est-ce que Playwright
Playwright est un framework moderne de tests de bout en bout prenant en charge Chromium, Firefox et WebKit.
Installation
L'assistant create-svelte de SvelteKit peut ajouter Playwright ; sinon, installez-le manuellement.
npm init playwright@latestConfiguration
L'assistant crée un playwright.config.js avec les paramètres du navigateur, le répertoire des tests et un point d'extension webServer pour lancer votre application.
Paramètre webServer
Playwright peut démarrer automatiquement npm run build && npm run preview avant les tests.
webServer: { command: "npm run build && npm run preview", port: 4173 }Structure des dossiers
Les tests se trouvent dans tests/ ou e2e/. Il est courant d'utiliser un fichier par fonctionnalité.
Exécuter les tests
Utilisez le script npm pour les exécuter.
npm run test:e2eMode interface utilisateur
Le mode interface utilisateur de Playwright permet de déboguer en remontant le temps.
npx playwright test --uiGénérer des tests
La commande codegen enregistre les interactions et écrit les tests à votre place.
npx playwright codegen http://localhost:5173Multi-navigateurs
Les tests s'exécutent en parallèle sur plusieurs navigateurs pour offrir une couverture étendue.
Visualiseur de traces
Les tests échoués produisent des traces que vous pouvez consulter avec playwright show-trace pour accélérer le débogage.
Intégration continue
Playwright s'exécute sur GitHub Actions, GitLab CI, etc., avec des images de conteneur officielles.
Vérification rapide
Que fait webServer dans Playwright ?
Récapitulatif
Configurez Playwright avec l'assistant. Configurez webServer pour démarrer automatiquement votre application, puis exécutez les tests avec npm run test:e2e.
Questions Fréquemment Posées
La leçon « Configurer Playwright dans SvelteKit » est-elle gratuite ?
Oui — le texte complet de « Configurer Playwright dans SvelteKit » est gratuit à lire ici sur le web. Pour la pratiquer de manière interactive (un éditeur de code intégré et un tuteur IA 24/7) et déverrouiller le reste du cours Sveltejs Academy, passe à CoddyKit PRO. Le cours Sveltejs Academy comprend 4 leçons au total.
Qu'est-ce que j'apprendrai dans « Configurer Playwright dans SvelteKit » ?
Installez et configurez Playwright pour un projet SvelteKit avec l’intégration officielle. Tu pratiques Sveltejs Academy avec du code pratique que tu exécutes directement dans le navigateur, et un tuteur IA 24/7 répond à tes questions au fur et à mesure que tu avances dans la leçon.
Dois-je avoir de l'expérience pour commencer Sveltejs Academy ?
Aucune expérience préalable n'est requise. Sveltejs Academy sur CoddyKit est structuré pour les débutants jusqu'aux apprenants avancés, donc tu peux commencer ici ou depuis le début et avancer à ton rythme. Ceci est la leçon 1 sur 4.
Combien de temps prend la leçon « Configurer Playwright dans SvelteKit » ?
La plupart des leçons CoddyKit prennent environ 5–10 minutes. Chacune est courte et interactive, tu progresses régulièrement et tu repiques exactement où tu t'es arrêté sur le web et l'app.
Peux-tu écrire et exécuter du code dans cette leçon Sveltejs Academy ?
Oui. Chaque leçon Sveltejs Academy inclut un éditeur de code intégré, tu écris et exécutes du vrai code directement dans ton navigateur et tu reçois des retours IA instantanés — aucune configuration locale requise.
Toutes les leçons de ce cours
- Configurer Playwright dans SvelteKit
- Écrire des tests d’interaction de page
- Tester les formulaires et la navigation
- Intégration à l’intégration continue