4-Estrutura-do-projeto.md

Estrutura do Projeto

Após executar npm init playwright@latest, seu projeto terá esta estrutura:

meu-projeto-playwright/
├── tests/
│   └── example.spec.ts       ← Arquivo de exemplo
├── tests-examples/
│   └── demo-todo-app.spec.ts ← Exemplo mais completo
├── playwright.config.ts       ← Configuração principal
├── package.json
├── package-lock.json
└── .github/
    └── workflows/
        └── playwright.yml    ← GitHub Actions (se escolhido)

playwright.config.ts

Este é o arquivo mais importante da configuração:

import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  // Diretório dos testes
  testDir: './tests',

  // Rodar testes em paralelo
  fullyParallel: true,

  // Falhar o build se .only estiver no código
  forbidOnly: !!process.env.CI,

  // Retentativas em CI
  retries: process.env.CI ? 2 : 0,

  // Workers (paralelos)
  workers: process.env.CI ? 1 : undefined,

  // Reporter
  reporter: 'html',

  // Configurações compartilhadas para todos os testes
  use: {
    // URL base para page.goto('/')
    baseURL: 'http://localhost:3000',

    // Salvar trace na primeira retentativa
    trace: 'on-first-retry',

    // Screenshot em falha
    screenshot: 'only-on-failure',

    // Video em falha
    video: 'on-first-retry',
  },

  // Projetos para multi-browser
  projects: [
    {
      name: 'chromium',
      use: { ...devices['Desktop Chrome'] },
    },
    {
      name: 'firefox',
      use: { ...devices['Desktop Firefox'] },
    },
    {
      name: 'webkit',
      use: { ...devices['Desktop Safari'] },
    },
    // Mobile
    {
      name: 'Mobile Chrome',
      use: { ...devices['Pixel 5'] },
    },
  ],
});

Estrutura Recomendada para Projetos Maiores

meu-projeto-playwright/
├── tests/
│   ├── auth/
│   │   ├── login.spec.ts
│   │   └── logout.spec.ts
│   ├── checkout/
│   │   └── compra.spec.ts
│   └── api/
│       └── usuarios.spec.ts
├── pages/                    ← Page Objects
│   ├── LoginPage.ts
│   └── DashboardPage.ts
├── fixtures/                 ← Fixtures customizadas
│   └── index.ts
├── playwright.config.ts
└── package.json

Scripts no package.json

{
  "scripts": {
    "test": "playwright test",
    "test:headed": "playwright test --headed",
    "test:debug": "playwright test --debug",
    "test:report": "playwright show-report",
    "codegen": "playwright codegen"
  }
}

---

Ir para: Dicas Gerais