LAB – Convertendo relatório do Cypress para mySQL

Estou iniciando uma nova categoria aqui no 4future, a categoria LAB.

Para descrever o processo de tecnologias que estamos testando pela primeira vez e descrever a jornada de aprendizado.

No time de testes, usamos Cypress para os testes de ponta a ponta (e2e). Porém o resultado dos testes ficam isolados com time de desenvolvimento. Não temos integração com os demais times.

Nossa ideia é democratizar os resultados dos testes e2e para o time de monitoração.

Quais são os requisitos:

  • Rodar os testes sob demanda
  • Coletar os resultados de maneira clara
  • Transferir os resultados para uma base de dados mySQL
  • A rotina deve ser facilmente parametrizada e escalável

Mãos a obra

Dwight Office Tv GIF by The Office - Find & Share on GIPHY

Criei um projeto simples em typescript que será responsável pelas duas funcionalidades, rodar o Cypress e enviar os dados para o mysql.

Instalei a lib mysql2 para gerenciar a comunicação com a base de dados. Por se tratar de um projeto simples, não há necessidade de uma camada ORM ou algo similar.

Também instalei o mochawesome para melhorar o relatório do Cypress. Desabilitei as opções de “gravação de vídeo” e do relatório em “HTML”. Aqui o objetivo é que nosso relatório seja consumido por computadores, não por humanos.

Antes de mais nada, vamos dar uma olhada em um exemplo de relatório gerado pelo mochawesome, pra gente ter uma ideia do que podemos consumir.

Aqui consegui entender que a propriedade “stats” guarda um resumo de como foi todo o teste. Seguindo pelo relatório, temos o array “results” que armazena os testes de forma recursiva.

Acho que já temos um bom ponto de partida 😀

Criei um módulo para configurar o setup inicial das tabelas que receberão os dados do mochawesome chamado database.config.ts.

Aqui vou incluir o comando para criar o database e mais duas tabelas.

RUNS, para registrar o resumo de cada execução do Cypress.
RESULTS, para registrar o resultado dos testes.

Adicionei mais alguns arquivos de testes de exemplo e rodei o relatório novamente.

Para minha surpresa, o mochawesome gera um relatório por teste.

O ideal seria ler de apenas UM arquivo de relatório. Só de pensar que preciso juntar todos os dados de maneira consistente, independente de quantos testes o time de qualidade precise escrever… Uhhh.

Baby Facepalm GIF by MOODMAN - Find & Share on GIPHY

Round 2

Não é possível que eu seja o primeiro desenvolvedor a pensar nisso. Alguém com certeza já precisou atender esses requisitos antes de mim.

Motivate Good Vibes GIF by Onbo - Find & Share on GIPHY

Dei mais uma olhada (com calma) na documentação do Cypress e eis que!!!

Existe uma ferramenta 3rd party do mochawesome para mesclar os relatórios.


Instalei o mochawesome-merge e configurei o comando de merge

"cy:merge": "mochawesome-merge ./mochawesome-report/*.json > ./report/output.json"

Agora vem a parte divertida!

Codei o módulo extract.report.ts que se conecta na base mysql, lê o relatório unificado e grava os resultados dos testes.

Et voilà

Well Done Reaction GIF - Find & Share on GIPHY

O link para o projeto completo está no meu GitHub
https://github.com/quatoo/cypress-mochawesome-to-mysql

Abraços galera e até a próxima 👋🏻

Sobre Filipe Borges 10 Artigos
Coordenador do time de desenvolvimento na BNP Soluções em TI. Ex-treinador de overwatch. Viciado em resolução de problemas. Sommelier de café não-oficial e pai do Heitor

Seja o primeiro a comentar

Faça um comentário

Seu e-mail não será divulgado.


*