Testes E2E no JavaScript com Cypress.io — APIs
Fala pessoal, tudo tranquilo? No meu último artigo sobre Cypress.io eu mostrei como realizar testes e2e com interações em interfaces graficas e validar que o fluxo como um todo está funcionando corretamente em uma visão aproximada do cliente (obs: antes de continuar esse artigo, é importante ler o artigo “Testes E2E no JavaScript com Cypress.io” para ter um melhor entendimento sobre como utilizar o cypress.io e como ele funciona). Agora imagine o cenário em que você não possui uma interface gráfica, pois você está desenvolvendo uma API, como ficariam os testes dela?
Como o próprio título do artigo já dá um leve spoiler, essa resposta fica fácil (rsrs), é possível seguir a mesma ideia que é mostrada no artigo anterior e realizar esses testes utilizando o Cypress.io.
Preparando o ambiente
Como base para os testes, eu utilizei o site do Traning Center e a API do Pokemon, portanto, não é preciso subir nenhuma aplicação, vamos apenas instalar o básico para rodar os testes.
Obs: devido ao fato de utilizarmos aplicações de terceiros, pode ser que alguns cenários dos testes parem de funcionar, caso isso aconteça, estarei sempre a disposição para atualizar o projeto, e todos podem se sentir a vontade para mandar PR (pull request) ajeitando possíveis erros ou até mesmo adicionando testes ao projeto. =)
- Instale o Node.js (esse artigo do Mateus Malaquias pode ajudar nesse processo).
- Instale o Git.
- Faça o download ou clone do repositório e2e-tests-js.
- Após o download terminar, acesse a pasta do projeto.
cd caminho/para/o/diretorio/e2e-tests-js
- Para instalar as dependências, basta executar o seguinte comando.
npm install
O Cypress.io e todas as suas dependências serão instaladas no projeto. Sim, nosso ambiente está pronto.
Como descrito na documentação “A complete end-to-end testing experience.” (Uma experiência completa de teste de ponta a ponta.), o Cypress diminui muito a complexidade de instalação que outras ferramentas possuem, apenas instalando ele como dependência, todo o ambiente estará pronto.
Caso queira instalar o Cypress em seu projeto, você pode rodar o comando a seguir:
npm install --save-dev cypressTestando…
Utilizando como exemplo para testes a API Pokemon, vamos criar o código do nosso teste no arquivo pokemon_api_spec.js, que fica dentro da pasta cypress/integration/.
O Cypress permite realizar requests na API através da função request() e validar o retorno através das funções its(), função responsável por pegar o parâmetro de retorno desejado, e should(), funcão que recebe dois parâmetros, o primeiro é como deve ser validado (no exemplo, o status deve ser.igual) e o segundo é o valor que o parâmetro deve ter.
O segundo teste, mostra uma outra maneira de se validar o retorno, existem muitas outras formas de se validar e muitas coisas diferentes que podem ser testadas, tudo está muito bem documentado na documentação do Cypress.io, o site também possui videos e instruções introdutórias a ferramenta.
Para rodar os testes, rode o comando a seguir no terminal:
npm run cypress:run
O resultado dos testes acima é o seguinte:
Na imagem acima estão rodando todos os testes, mas o teste que importa é o teste Pokemon API, foram esses testes que escrevemos para testar a API do pokemon, os testes Training Center - Site foram mostrados no artigo anterior, e estão em outro arquivo de teste, o tc_spec.js.
Se tudo estiver certo, tudo deve ficar verde como na imagem acima, caso ocorra algum erro, o teste com erro ficara em vermelho, caso isso ocorra, bastar verificar se o erro ocorreu por que sua aplicação não se comportou como esperado, ou se o seu teste possui algum erro. Após fazer as alterações necessárias, basta rodar os testes novamente e verificar se todos os testes passam, e assim é o fluxo de trabalho utilizando testes automatizados, diversas iterações entre codar, rodar testes, ajeitar o que for preciso e rodar testes novamente até que se tenha um código de qualidade e que atenda os requisitos.
Espero que tenha gostado, e deixe sua opinião nos comentários, feedbacks são sempre bem vindos para melhorar o conteúdo. =)
No próximo post, irei mostrar como realizar testes e2e em uma API.
Qualquer dúvida podem entrar em contato comigo pelo Twitter @lflimeira02, no Slack do Training Center ou no Slack do PHPSP com o username @lflimeira.
