Configuração do Playwright no SvelteKit
Instale e configure o Playwright para um projeto SvelteKit com a integração oficial.
Configuração do Playwright no SvelteKit é uma aula grátis de Sveltejs Academy no CoddyKit. Esta é a aula 1 de 4. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de Sveltejs Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de Sveltejs Academy inclui 4 aulas no total.
O que é Playwright
Playwright é uma estrutura moderna para testes de ponta a ponta, compatível com Chromium, Firefox e WebKit.
Instalação
O assistente create-svelte do SvelteKit pode adicionar Playwright; caso contrário, instale-o manualmente.
npm init playwright@latestConfiguração
O assistente cria um playwright.config.js com configurações do navegador, diretório de testes e um gancho webServer para iniciar seu aplicativo.
Configuração de webServer
Playwright pode iniciar automaticamente npm run build && npm run preview antes dos testes.
webServer: { command: "npm run build && npm run preview", port: 4173 }Estrutura de pastas
Os testes ficam em tests/ ou e2e/. É comum usar um arquivo por funcionalidade.
Executar testes
Use o script do npm para executar.
npm run test:e2eModo de interface
O modo de interface do Playwright oferece depuração com viagem no tempo.
npx playwright test --uiGerar testes
O comando codegen registra interações e escreve os testes para você.
npx playwright codegen http://localhost:5173Multinavegador
Os testes são executados em vários navegadores em paralelo para oferecer uma cobertura ampla.
Visualizador de rastreamentos
Testes com falha produzem rastreamentos que você pode visualizar com playwright show-trace para depurar rapidamente.
Integração contínua
Playwright é executado no GitHub Actions, no GitLab CI e em outros serviços, com imagens oficiais de contêineres.
Verificação rápida
O que o webServer do Playwright faz?
Recapitulação
Configure Playwright com o assistente. Configure webServer para iniciar automaticamente seu aplicativo e execute os testes com npm run test:e2e.
Perguntas Frequentes
A aula “Configuração do Playwright no SvelteKit” é grátis?
Sim — o texto completo de “Configuração do Playwright no SvelteKit” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de Sveltejs Academy, atualize para CoddyKit PRO. O curso de Sveltejs Academy inclui 4 aulas no total.
O que vou aprender em “Configuração do Playwright no SvelteKit”?
Instale e configure o Playwright para um projeto SvelteKit com a integração oficial. Você pratica Sveltejs Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.
Preciso ter experiência prévia para começar Sveltejs Academy?
Nenhuma experiência prévia é necessária. Sveltejs Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 1 de 4.
Quanto tempo leva a aula “Configuração do Playwright no SvelteKit”?
A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.
Posso escrever e executar código nesta aula de Sveltejs Academy?
Sim. Cada aula de Sveltejs Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.
Todas as aulas deste curso
- Configuração do Playwright no SvelteKit
- Escrevendo testes de interação de páginas
- Testando formulários e navegação
- Integração contínua