Tutorial: Executar testes completos do Playwright com o serviço de Microsoft Playwright Testing

Importante

O Microsoft Playwright Testing será desativado em 8 de março de 2026. Para continuar executando seus testes do Playwright, crie um novo Workspace do Playwright no Teste de Aplicativos do Azure, agora em disponibilidade geral. Saiba como migrar.

Neste tutorial, você aprenderá a integrar seu conjunto de testes do Playwright ao Microsoft Playwright Testing, executar testes mais rapidamente usando navegadores hospedados na nuvem e solucionar problemas com eficiência usando os recursos de relatório do serviço. Você simula um conjunto de testes do Playwright, conecta-o ao serviço para uma execução mais rápida e usa ferramentas de relatório para solucionar problemas simplificado.

Neste tutorial, você:

Configure um conjunto de testes do Playwright.
Integre o conjunto de testes do Playwright ao serviço Microsoft Playwright Testing.
Execute o conjunto de testes com o serviço para uma execução mais rápida e solução de problemas eficiente.

Pré-requisitos

Uma conta do Azure com uma assinatura ativa. Se você não tiver uma assinatura do Azure, crie uma conta gratuita antes de começar.
A CLI do Azure instalada no computador local.
CLI do Azure, versão 2.2.0 ou posterior. Execute az --version para verificar a versão instalada em seu computador. Se precisar instalar ou atualizar a CLI, do Azure, confira Como instalar a CLI do Azure.
Visual Studio Code. Caso ainda não o tenha, baixe-o e instale-o.
Git. Caso ainda não o tenha, baixe-o e instale-o.

Verificação de Pré-requisitos

Antes de começar, valide seu ambiente:

Entre no portal do Azure e verifique se sua assinatura está ativa.
Verifique sua versão da CLI do Azure em uma janela Comando ou de terminal executando az --version. Para obter a última versão, confira as notas sobre a versão mais recente.

Caso não tenha a última versão, atualize a instalação seguindo o guia de instalação para seu sistema operacional ou sua plataforma.

Configurar o conjunto de testes do Playwright

Nesta etapa, você está criando um conjunto de testes do Playwright que é integrado ao serviço.

Clone o repositório de exemplo e navegue até a pasta de teste.

git clone https://github.com/microsoft/playwright-testing-service
cd playwright-testing-service/samples/get-started

Instale as dependências.

npm install

Execute testes de Playwright.

Execute este comando para executar testes localmente, fora do serviço, para identificar quaisquer problemas antes da integração com o serviço. Este projeto é usado nas próximas etapas para integração com o serviço.

npx playwright test

Integrar o conjunto de testes do Playwright ao serviço Microsoft Playwright Testing

Integre o conjunto de testes do Playwright que você criou no tutorial anterior com o serviço de Teste do Playwright.

Siga estas etapas para configurar o serviço e integrar o conjunto de testes.

Criar um espaço de trabalho de teste de Playwright

Para começar a executar seus testes Playwright em escala em navegadores de nuvem, primeiro crie um espaço de trabalho do Microsoft Playwright Testing no portal do Playwright.

Entre no portal do Playwright com sua conta do Azure.
Se você já tiver um espaço de trabalho, selecione um espaço de trabalho existente e vá para a próxima etapa.

Dica

Se você tiver vários espaços de trabalho, poderá alternar para outro espaço de trabalho selecionando o nome do espaço de trabalho na parte superior da página e selecionando Gerenciar todos os espaços de trabalho.

Se você ainda não tiver um espaço de trabalho, selecione + Novo espaço de trabalho e forneça as seguintes informações:

Campo	Descrição
Nome do workspace	Insira um nome exclusivo para identificar seu espaço de trabalho. O nome só pode consistir em caracteres alfanuméricos e ter um comprimento entre 3 e 64 caracteres.
Assinatura do Azure	Selecione a assinatura do Azure que você deseja usar para este espaço de trabalho do Microsoft Playwright Testing.
Região	Selecione um local geográfico para hospedar seu espaço de trabalho. Este é o local onde os dados de execução de teste são armazenados para o espaço de trabalho.

Selecione Criar espaço de trabalho para criar o espaço de trabalho em sua assinatura.

Durante a criação do espaço de trabalho, um novo grupo de recursos e um recurso do Microsoft Playwright Testing Azure são criados em sua assinatura do Azure.

Quando a criação do espaço de trabalho terminar, você será redirecionado para o guia de configuração.

Instale o pacote do Microsoft Playwright Testing

Para instalar o pacote de serviços, navegue até o local do conjunto de testes que você criou no tutorial anterior e execute este comando:

npm init @azure/microsoft-playwright-testing@latest

Esse comando gera um arquivo playwright.service.config.ts, que serve para:

Direcionar e autenticar o Playwright para o serviço Microsoft Playwright Testing.
Adiciona um repórter para publicar resultados de testes e artefatos.

Configurar o ponto de extremidade da região de serviço

Em sua configuração, você deve fornecer o ponto de extremidade do serviço específico da região. O ponto de extremidade depende da região do Azure que você selecionou ao criar o espaço de trabalho.

Para obter a URL do ponto de extremidade do serviço, execute as seguintes etapas:

Em Adicionar ponto de extremidade de região em sua configuração, copie o ponto de extremidade de região para seu espaço de trabalho.

A URL do ponto de extremidade corresponde à região do Azure que você selecionou ao criar o espaço de trabalho. Verifique se essa URL está disponível em PLAYWRIGHT_SERVICE_URL variável de ambiente.

Configure seu ambiente

Para configurar seu ambiente, é necessário configurar a variável de ambiente PLAYWRIGHT_SERVICE_URL com o valor obtido nas etapas anteriores.

Recomendamos que você use o módulo dotenv para gerenciar seu ambiente. Com dotenv, você define suas variáveis de ambiente no arquivo .env.

Adicione o módulo dotenv ao seu projeto:
```
npm i --save-dev dotenv
```
Crie um arquivo .env acompanhado do arquivo playwright.config.ts no projeto do Playwright:
```
PLAYWRIGHT_SERVICE_URL={MY-REGION-ENDPOINT}
```
Certifique-se de substituir o espaço reservado para texto {MY-REGION-ENDPOINT} pelo valor que você copiou anteriormente.

Configurar a autenticação

Para executar os testes do Playwright no workspace do Microsoft Playwright Testing, é necessário autenticar o cliente do Playwright onde você está executando os testes com o serviço. Autentique com a estação de trabalho de desenvolvimento em que você está executando os testes do Playwright.

O Microsoft Entra ID é a autenticação padrão e recomendada para o serviço. Usar CLI do Azure para entrar

az login

Observação

Se você fizer parte de vários locatários do Microsoft Entra, certifique-se de entrar no locatário ao qual seu workspace pertence. Você pode obter a ID do locatário no portal do Azure. Consulte Encontre seu Locatário do Microsoft Entra. Depois de obter a ID, entre usando o comando az login --tenant <TenantID>

Habilitar artefatos na configuração do Playwright

No arquivo playwright.config.ts do seu projeto, certifique-se de coletar todos os artefatos necessários.

  use: {
    trace: 'on-first-retry',
    video:'retain-on-failure',
    screenshot:'on'
  }

Execute seus testes em escala e solucione problemas facilmente com o Microsoft Playwright Testing

Agora você preparou a configuração para executar seus testes de Playwright na nuvem com o Microsoft Playwright Testing.

Executar testes do Playwright com o serviço

Com o Microsoft Playwright Testing, você é cobrado com base no número total de minutos de teste e no número de resultados de teste publicados. Se você for um usuário iniciante ou começando com uma avaliação gratuita, poderá executar um único teste em escala em vez de seu conjunto de testes completo para evitar esgotar seus limites de avaliação gratuita.

Siga estas etapas para executar testes do Playwright com o Microsoft Playwright Testing:

Abra uma janela de terminal.
Insira o comando a seguir para executar o conjunto de testes do Playwright em navegadores remotos e publicar os resultados do teste no espaço de trabalho.
```
npx playwright test --config=playwright.service.config.ts --workers=20
```
Após a conclusão do teste, você pode exibir o status do teste no terminal.
```
Running 600 tests using 20 workers
    600 passed (3m)

Test report: https://playwright.microsoft.com/workspaces/<workspace-id>/runs/<run-id>
```

Exibir execuções de teste e resultados no portal do Playwright

Agora, você pode solucionar problemas dos casos de testes com falha no portal do Playwright.

Após o término da execução dos testes, um link para o Portal Playwright é gerado. Abra este link para exibir resultados de teste detalhados e artefatos associados. O portal exibe informações essenciais, incluindo:
- Detalhes da build de CI
- Status geral da execução do teste
- A ID de confirmação vinculada à execução de teste
O portal do Playwright fornece todas as informações necessárias para solução de problemas. Você pode:
- Alterne entre novas tentativas.
- Exiba logs de erros detalhados, etapas de teste e artefatos anexados, como capturas de tela ou vídeos.
- Navegue diretamente até o Visualizador de Rastreamento para obter uma análise mais profunda.
O Visualizador de Rastreamento permite que você percorra a execução do teste visualmente. Você pode:
- Use a linha do tempo para focalizar as etapas individuais, revelando o estado da página antes e depois de cada ação.
- Inspecione logs detalhados, instantâneos do DOM, atividade de rede, erros e saída do console para cada etapa.

Dica

Você pode usar os recursos do serviço Microsoft Playwright Testing de forma independente. Você pode publicar os resultados dos testes no portal sem usar o recurso de navegadores hospedados na nuvem e você também pode usar apenas os navegadores hospedados na nuvem para agilizar seu conjunto de testes sem publicar os resultados dos testes.