5-Dicas-gerais.md

Dicas Gerais

Codegen: Gravando Testes Automaticamente

O Codegen abre um navegador e grava suas ações como código TypeScript:

npx playwright codegen https://meusite.com

Uma janela do navegador abre junto com o editor de código. Tudo que você clicar e digitar vira código pronto para usar.

Para gravar em um dispositivo mobile:

npx playwright codegen --device="iPhone 13" https://meusite.com

Trace Viewer: Depurando Falhas

O Trace Viewer grava um "filme" de cada teste — cada ação, screenshot, rede e console log.

Habilite no playwright.config.ts:

use: {
  trace: 'on-first-retry',  // grava só quando o teste falha e é reexecutado
  // ou 'retain-on-failure'  // grava e mantém só se falhar
  // ou 'on'                 // grava sempre
}

Abra o trace após uma falha:

npx playwright show-trace test-results/meu-teste/trace.zip

Inspector: Depuração Passo a Passo

Para pausar o teste e inspecionar o estado da página:

# Modo debug completo (abre o inspector)
npx playwright test --debug

# Ou adicione no código:
await page.pause();

Variáveis de Ambiente

Crie um arquivo .env na raiz do projeto:

BASE_URL=https://staging.meuapp.com
USUARIO=teste@email.com
SENHA=senha123

Instale o dotenv:

npm install -D dotenv

No playwright.config.ts:

import dotenv from 'dotenv';
dotenv.config();

export default defineConfig({
  use: {
    baseURL: process.env.BASE_URL,
  },
});

TypeScript com Checagem Estrita

Configure o tsconfig.json para máxima segurança:

{
  "compilerOptions": {
    "target": "ESNext",
    "module": "CommonJS",
    "strict": true,
    "esModuleInterop": true
  }
}

---

Ir para: Seletores