Como Criar um Projeto com Playwright do Zero

Se você está começando na área de QA ou quer automatizar testes de forma eficiente, o Playwright é uma ferramenta moderna e poderosa mantida pela Microsoft. Neste post, vou te mostrar como criar um projeto do zero com Playwright, ideal para iniciantes.

O que é o Playwright?

Playwright é uma biblioteca de automação para navegadores como Chrome, Firefox e Safari. Com ele, é possível simular interações reais do usuário, testar funcionalidades e validar comportamentos de forma automatizada.

Pré-requisitos

Antes de começar, você precisa ter o Node.js instalado na sua máquina. Verifique se está instalado com:

JavaScript

node -v
npm -v

Copiar node -v npm -v

Se estiver tudo certo, vamos criar o projeto.

Passo a Passo para Criar um Projeto com Playwright

1. Crie uma pasta para o projeto

JavaScript

mkdir meu-projeto-playwright
cd meu-projeto-playwright

Copiar mkdir meu-projeto-playwright cd meu-projeto-playwright

2. Inicie um projeto Node.js

JavaScript

npm init -y

Copiar npm init -y

3. Instale o Playwright bash Copiar Editar

JavaScript

npm install -D @playwright/test

Copiar npm install -D @playwright/test

Isso instala o Playwright com o framework de testes incluído (@playwright/test).

4. Inicialize o projeto com Playwright

JavaScript

npx playwright install

Copiar npx playwright install

5. (Opcional) Use o comando de scaffolding

JavaScript

npx playwright test --init

Copiar npx playwright test —init

Esse comando cria a estrutura básica do projeto com:

• uma pasta tests

• um arquivo de configuração playwright.config.ts

6. Escreva seu primeiro teste

Crie um arquivo tests/example.spec.ts com o seguinte conteúdo:

JavaScript

import { test, expect } from '@playwright/test';
test('deve acessar a página e verificar o título', async ({ page }) => {
  await page.goto('https://example.com');
  await expect(page).toHaveTitle(/Example Domain/);
});

Copiar import { test, expect } from ‘@playwright/test’; test(‘deve acessar a página e verificar o título’, async ({ page }) => { await page.goto(‘https://example.com’); await expect(page).toHaveTitle(/Example Domain/); });

7. Execute o teste

JavaScript

npx playwright test

Copiar npx playwright test

Você verá o teste rodar no terminal. Para assistir o teste visualmente, use:

JavaScript

npx playwright test --headed

Copiar npx playwright test —headed