# Suite de Testes E2E - Course Platform Esta suite utiliza **Playwright** para testes end-to-end da aplicação. ## 📋 Estrutura dos Testes ``` tests/ ├── e2e/ │ ├── auth/ │ │ ├── login.spec.ts # Login e autenticação │ │ └── register.spec.ts # Cadastro e seleção de role │ ├── admin/ │ │ ├── classes.spec.ts # Gestão de turmas │ │ └── payments.spec.ts # Pagamentos e obrigações │ ├── guardian/ │ │ └── wards.spec.ts # Alunos vinculados (wards) │ ├── student/ │ │ └── exams.spec.ts # Provas e avaliações │ ├── ui/ │ │ └── theme-and-responsive.spec.ts # Tema, responsividade, modais │ └── error-cases.spec.ts # Casos de erro importantes └── helpers.ts # Utilidades e fixtures ``` ## 🚀 Comandos Disponíveis ```bash # Instalar navegadores do Playwright npx playwright install # Instalar apenas Chromium (mais rápido) npx playwright install chromium # Executar todos os testes npm test # Executar com interface visual npm run test:ui # Executar em modo headed (ver navegador) npm run test:headed # Executar em modo debug npm run test:debug # Ver relatório HTML npm run test:report # Executar testes específicos npm test -- tests/e2e/auth/login.spec.ts # Executar em navegador específico npm test --project=chromium npm test --project=firefox npm test --project=webkit # Executar em mobile npm test --project="Mobile Chrome" npm test --project="Mobile Safari" ``` ## 📁 Cenários de Teste Cobertos ### 1. Autenticação - ✅ Login com credenciais válidas/inválidas - ✅ Redirecionamento para login em rotas protegidas - ✅ Cadastro com validações - ✅ Navbar muda estado conforme autenticação - ✅ Dispatcher (múltiplos roles) ### 2. Wards (Alunos vinculados a Responsáveis) - ✅ Cadastro de ward por responsável - ✅ Validação de email duplicado - ✅ Visualização de lista de wards - ✅ Acesso a detalhes de ward ### 3. Admin - Turmas - ✅ Listagem e busca - ✅ Criação com validações - ✅ Edição (professores, alunos, dias) - ✅ Validação de datas - ✅ Checkboxes de professores e dias da semana ### 4. Admin - Pagamentos - ✅ Visualização por turma - ✅ Expansão/colapso - ✅ Filtros de status - ✅ Aprovação/rejeição - ✅ Modal de comprovante ### 5. Aluno - Provas - ✅ Lista de provas disponíveis - ✅ Fazer prova - ✅ Timer de contagem regressiva - ✅ Submissão - ✅ Resultados ### 6. UI/UX - ✅ Tema claro/escuro - ✅ Responsividade (mobile, tablet) - ✅ Modais - ✅ Hover states - ✅ Loading states ### 7. Casos de Erro - ✅ Acesso não autorizado - ✅ Validações de formulário - � Email duplicado - ✅ Data inválida - ✅ Provas após prazo - ✅ Submissão duplicada ## ⚠️ Testes Marcados com TODO Alguns testes estão marcados com `// TODO:` porque dependem de: 1. **Dados de teste no banco de dados** - Criar usuários de teste (admin, teacher, student, guardian) - Criar turmas, categorias, templates de prova - Criar obrigações e pagamentos 2. **Implementação de funcionalidades** - Algumas validações podem não estar implementadas ainda ## 🛠️ Como Configurar Dados de Teste ### Opção 1: Script de Seed Crie um script em `scripts/seed-tests.ts` que popula o banco com dados de teste: ```typescript import { getUserModel } from "@/app/models/User"; import bcrypt from "bcryptjs"; const testUsers = [ { email: "admin@teste.com", password: await bcrypt.hash("123456", 10), fullName: "Admin Teste", roles: ["admin"], }, // ... outros usuários ]; export async function seedTestData() { const User = await getUserModel(); await User.deleteMany({ email: { $in: testUsers.map(u => u.email) } }); await User.create(testUsers); } ``` ### Opção 2: Fixtures do Playwright Use o `beforeEach` para criar dados necessários para cada teste: ```typescript test.beforeEach(async ({ page }) => { // Criar usuário via API await page.request.post('/api/test/users', { data: { email: 'temp@teste.com', password: '123456' } }); }); ``` ## 📊 Relatórios Após executar os testes, o relatório HTML é gerado em: ``` playwright-report/ └── index.html ``` Abra com: ```bash npm run test:report # ou npx playwright show-report ``` ## 🔧 Configuração Arquivo de configuração: `playwright.config.ts` Configurações principais: - **baseURL**: `http://localhost:3000` - **testDir**: `./tests/e2e` - **webServer**: Inicia o dev server automaticamente ## 📝 Convenções 1. **Nome de testes**: Escreva em português, descrevendo o comportamento ```typescript test('deve mostrar erro com email inválido', async ({ page }) => { ``` 2. **Selectores**: Prefira seletores acessíveis ```typescript page.getByLabel(/email/i) page.getByRole('button', { name: /salvar/i }) ``` 3. **Esperas**: Seja específico ```typescript await expect(page).toHaveURL(/\/admin\/dashboard/); await expect(page.getByText(/sucesso/i)).toBeVisible(); ``` 4. **TODOs**: Marque testes que dependem de implementação futura ```typescript // TODO: Implementar após login ``` ## 🐛 Debug Execute um teste específico em modo debug: ```bash npx playwright test --debug tests/e2e/auth/login.spec.ts ``` Isso abre o Playwright Inspector para inspecionar elementos e ver o que está acontecendo. ## 📚 Recursos - [Playwright Documentation](https://playwright.dev) - [Playwright Best Practices](https://playwright.dev/docs/best-practices) - [Selectors Guide](https://playwright.dev/docs/selectors)