Este repositório contém o projeto desenvolvido durante o curso Testes contínuos em Cypress no Github Actions, ministrado por Fernando Papito na plataforma Udemy.
O objetivo é demonstrar a integração de testes automatizados com Cypress em um pipeline de CI/CD utilizando o GitHub Actions, incluindo relatórios e métricas com Cypress Cloud, Tesults e Allure Report.
Com este setup, é possível garantir que os testes de regressão sejam executados automaticamente a cada alteração no código, proporcionando uma detecção precoce de bugs e um aumento na confiabilidade do sistema.
Clique aqui para expandir as informações sobre o Curso
O principal objetivo deste projeto é construir um fluxo de trabalho (workflow) de testes contínuos que:
- 🔄 Automatize a execução dos testes de regressão do Cypress.
- ⚙️ Utilize o GitHub Actions para orquestrar o pipeline de testes.
- 📊 Gere relatórios, screenshots e métricas para evidenciar a execução dos testes:
- ☁️ Integre-se ao Cypress Cloud (antigo Cypress Dashboard) para uma visualização detalhada do histórico de testes.
- ☁️ Integre-se ao Tesults para uma visualização detalhada do histórico de testes.
- ☁️ Integre-se ao Allure Report para uma visualização detalhada do histórico de testes.
Durante o curso, foram aplicados os seguintes conceitos:
- Construção de Pipelines e Workflows de CI/CD: Criação de arquivos .yml para automatizar a execução dos testes no GitHub Actions.
- Testes Contínuos com Cypress: Configuração e execução dos testes de regressão de forma automática, garantindo a detecção precoce de bugs.
- Geração de Relatórios e Métricas: Configuração de integrações para gerar evidências de execução (vídeos, screenshots) e dashboards com relatórios detalhados.
A execução dos testes gera relatórios completos e evidências que podem ser acompanhados em diferentes plataformas, garantindo rastreabilidade, análise detalhada e colaboração da equipe.
Esses relatórios permitem:
- Visualizar o histórico de execuções com status, tempo e desempenho.
- Consultar evidências (screenshots, vídeos, anexos e logs).
- Identificar falhas e tendências com métricas e gráficos em tempo real.
- Consolidar e compartilhar resultados em dashboards interativos.
- As ferramentas utilizadas neste projeto são:
As ferramentas de geração de relatórios e métricas utilizadas neste projeto são:
Os fluxos de trabalho (workflows) estão configurados no diretório .github/workflows/. Cada arquivo YAML define um pipeline de CI/CD que pode ser ativado manualmente.
-
cypress-tests.yml:Este workflow é configurado para a integração com o Tesults. -
cypress-cloud.yml:Este workflow é configurado para a integração com o Cypress Cloud.
Cada workflow executa a suíte de testes de ponta a ponta em múltiplos navegadores (Electron, Chrome, Edge e Firefox) e envia os resultados da execução, incluindo logs, vídeos e screenshots, para a respectiva plataforma.
O projeto segue a estrutura padrão do Cypress e inclui arquivos de configuração específicos para a integração contínua.
Clique aqui para expandir a estrutura de arquivos
📦 cypress-actions/
┣ 📂 .github/
┃ └── workflows/
┃ ┣ 📜 cypress-cloud.yml # Workflow para execução de testes no Cypress Cloud
┃ ┗ 📜 cypress-tests.yml # Workflow para execução básica de testes
┣ 📂 cypress/
┃ ┣ 📂 e2e/
┃ ┃ ┗ 📜 login.cy.js # Exemplo de um caso de teste e2e
┃ ┗ 📂 support/
┃ ┣ 📜 commands.js # Comandos customizados do Cypress
┃ ┗ 📜 e2e.js # Arquivo de suporte
┣ 📜 .gitignore # Arquivos e pastas a serem ignorados pelo Git
┣ 📜 cypress.config.js # Arquivo de configuração global do Cypress
┣ 📜 package-lock.json # Controle de versões exatas das dependências
┣ 📜 package.json # Lista as dependências e scripts do projeto
┣ 📜 README.md # Documentação principal do repositório
┣ 📜 runner-chrome.js # Script para execução com Chrome
┣ 📜 runner-edge.js # Script para execução com Edge
┣ 📜 runner-electron.js # Script para execução com Electron
┣ 📜 runner-firefox.js # Script para execução com Firefox
┣ 📜 runner.js # Script principal de execução
┗ 📜 yarn.lock # Controle de versões exatas das dependências
Este projeto foi desenvolvido com as seguintes ferramentas e tecnologias. Certifique-se de que sua máquina atende aos requisitos abaixo para executar os testes.
Clique aqui para expandir as informações
- JavaScript → Linguagem utilizada para implementação dos testes.
- Cypress → Framework de automação de testes end-to-end para aplicações web.
- Node.js + npm/Yarn → Ambiente de execução e gerenciamento de dependências.
- Java → Necessário para geração de relatórios com o cypress-allure-plugin.
Clique aqui para expandir as informações
- Visual Studio Code → IDE utilizada para desenvolvimento e manutenção dos testes.
- Git → Controle de versão.
- GitHub → Repositório remoto para versionamento e compartilhamento do código.
🔹 Pré-requisitos
Antes de executar os testes, certifique-se de que possui os seguintes itens instalados na sua máquina:
-
Ferramentas de linha de comando (CLI) As ferramentas de terminal, também conhecidas como linha de comando (command-line interface ou CLI), é necessária para fazer as instalações, configurar o ambiente e executar os testes.
- Windows Terminal e Prompt de Comando: São as ferramentas padrão no Windows.
- Tutoriais de instalação:
- Git Bash: É um emulador de terminal que vem com o Git, muito popular no Windows.
- CMDER: É uma ferramenta de terceiros que oferece uma experiência de terminal mais completa e amigável.
- Tutoriais de instalação:
- Windows Terminal e Prompt de Comando: São as ferramentas padrão no Windows.
-
Node.js:
- Versão neste projeto: 22.14.0 LTS
- Faça o download do Node.js
- Gerenciadores de pacotes:
- npm versão 11.5.2.
- yarn versão 4.6.0 (via Corepack).
- Habilitar com o comando abaixo, após instalar o Node.js:
corepack enable
- Tutoriais de instalação:
-
Java:
- Versão neste projeto: openjdk 21.0.8 LTS
- Faça o download do Java JDK Zulu
- Tutoriais de instalação:
ℹ️ Observação: É necessário para a geração de relatórios com o Cypress Allure Plugin.
-
Git
-
Editor de Código (IDE)
- Visual Studio Code ou outra IDE compatível com Cypress.
- Tutoriais de instalação:
ℹ️ Observação: O instrutor do curso indicou o uso de versões específicas. No entanto, este projeto foi testado com as versões mais recentes (Node.js, Cypress, Java e Yarn) e funcionou corretamente.
🔹 Instalação das dependências
Com os pré-requisitos instalados, siga estes passos para instalar as dependências do projeto:
- Abra a sua ferramenta de linha de comando (CLI) e siga os passos a seguir:
- Clonar o repositório via "HTTPS":
git clone https://github.com/sthefanyricardo/cypress-actions.git- Acessar a pasta do projeto:
cd cypress-actions- Instalar as dependências:
yarn installℹ️ Observação: O instrutor do curso indicou o uso de versões específicas. No entanto, este projeto foi testado com as versões mais recentes (Node.js e Cypress) e funcionou corretamente.
Clique aqui para ver as instruções
Abra o terminal na pasta principal do projeto:
cd .../cypress-actions- Modo Interativo (GUI)
- Execute o comando para abrir a interface gráfica do Cypress:
yarn cypress open
- Na interface do Cypress:
- Clique em Continue
- Em Welcome to Cypress!, selecione E2E Testing
- Escolha o navegador (o padrão é Electron)
- Clique em Start E2E Testing in {navegador escolhido}
- Acesse: cypress-actions > Specs > E2E specs > cypress/e2e
- Clique em home para executar a suíte de testes home
- Clique em tasks para executar a suíte de testes tasks
ℹ️ Qualquer edição e salvamento no arquivos executa automaticamente a suíte selecionada na interface gráfica do Cypress.
- Modo Headless (CLI)
- Executar todos os testes:
yarn cypress runℹ️ Executa todos os testes da pasta cypress/e2e em modo headless.
- Executar testes em navegador específico:
yarn cypress run --browser chromeℹ️ Os resultados são exibidos diretamente no terminal.
- Gerar vídeos da execução: No arquivo cypress.config.js, adicione a opção:
module.exports = {
e2e: {
video: true
},
};ℹ️ Após isso, os vídeos serão gravados automaticamente na pasta padrão do Cypress, nas execuções em modo headless.
- Modo Headless com Relatório Allure Report
- Execute os testes gerando o relatório com o Cypress Allure Plugin:
yarn cypress run --env allure=true- Ao instrutor Fernando Papito pelo curso e compartilhamento de conhecimento.
- À comunidade de automação de testes por todo o suporte e inspiração.
- Observações:
- Este repositório é destinado a fins educacionais para demonstrar conceitos da execução de testes automatizados Cypress com o Github Actions.
- Sinta-se à vontade para clonar, modificar e utilizar este código como base para seus próprios projetos.
Feito com ❤️ por Sthefany A. Ricardo.
- Este
README.mdfoi gerado com a assistência de modelos de linguagem como o Google Gemini e o ChatGPT, para garantir clareza, formatação e um conteúdo completo.