Concrete Logo
Hamburger button

Como anexar ao report o screenshot com o Protractor

  • Blog
  • 26 de Novembro de 2018

Quem nunca teve que perder algumas (preciosas!) horas para investigar os motivos dos testes e2e estarem falhando? A maioria, certo? Talvez o que você não sabe é que o screenshot elimina essa sua dor em alguns segundos.

Mas por que tirar um screenshot?

Imaginem um cenário de login com sucesso onde em um determinado momento esse teste começa a falhar inexplicavelmente. O primeiro passo seria olhar o screenshot gerado ao final do teste para entendermos o que aconteceu.

Isso porque no screenshot já conseguimos ver se o robô digitou nos campos obrigatórios, se o campo deixou de existir em tela, se esse determinado user não está mais cadastrado na base de dados etc… Além de rápido, é totalmente visual e agrega demais para o desenvolvimento.

E após tudo isso que implica de forma positiva para o desenvolvimento, sabemos o quão essencial é termos os screenshots em nossos reports para termos uma visão mais segura e assertiva sobre os nossos cenários de testes. Enfim, sem mais delongas, vamos ver como é simples anexarmos as nossas evidências de falha no report final dos testes e2e.

HandsOn!

Mantendo sempre em mente as boas práticas, vamos trabalhar com um arquivo chamado hooks.js. Nele teremos o nosso screenshot dentro de um After que vou explicar melhor a seguir.

Vamos nos atentar apenas ao After desse arquivo hooks.js.

Estamos apenas colocando uma condição que, caso o status do cenário seja FALHADO, vamos tirar um print screen e colocar esse print já aberto no report gerado no final dos testes.

Agora, em nosso arquivo conf.js, vamos precisar apenas do npm do cucumber-html-reporter para gerar o report com o screenshot. Para trabalhar com ele é muito simples, dá só uma olhada:

Vou colocar apenas o parâmetro do storeScreenshots: false para não armazenar os screenshots no projeto, porém vou anexá-los como imagens em sequência ao report em HTML. Apenas isso, galera! Simples, fácil, rápido e bastante funcional.

Resultado final

Após configurarmos, caso algum cenário falhe, teremos o seguinte report.

Conseguimos observar que dentro do step desse cenário o screenshot foi anexado com sucesso.

Pronto, feito!

Então é isso, pessoal. Espero que isso consiga ajudá-los.

Qualquer dúvida basta comentar aqui no post 🙂

Referências

No capítulo de QA da Concrete nós nos importamos com o que criamos. Somos parte fundamental dos times de desenvolvimento, pois garantimos a qualidade de engenharia do produto final. Nosso papel é desenvolver e automatizar a suíte de testes de comportamento, criando e mantendo testes de aceitação, regressão e integração. Para isso, utilizamos tecnologias como Cucumber, Calabash e Ruby. Nosso DNA tem palavras como Agile Testing, Especificação por Exemplo e Automação de Testes.Trabalhe com os melhores! Acesse: concrete.com.br/vagas