course-plat/tests/README.md

# 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: "[email protected]",
    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: '[email protected]', 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)