Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

TDC 2015 Floripa - Visual Regression Testing em ambientes na nuvem

1,357 views

Published on

Palestra apresentada na trilha de Testes do TDC 2015 Florianópolis, no dia 13/05

Published in: Software

TDC 2015 Floripa - Visual Regression Testing em ambientes na nuvem

  1. 1. Globalcode – Open4education Visual Regression Testing em ambientes na nuvem Stefan Teixeira stefanfk@gmail.com / stefanteixeira.com.br
  2. 2. About me Stefan Teixeira • QA / DevOps • Bacharel em Ciência da Computação pela UFRJ • MBA em Garantia de Qualidade de Software pela Escola Politécnica da UFRJ • Mantém um blog técnico sobre testes: stefanteixeira.com.br • Entusiasta de Testes Automatizados, Agile Testing e da cultura DevOps Contatos: • E-mail: stefanfk@gmail.com • Twitter: twitter.com/stefan_teixeira • Facebook: facebook.com/stefan.teixeira • LinkedIn: linkedin.com/in/stefanteixeira • GitHub: github.com/stefanteixeira • SlideShare: slideshare.net/stefanteixeira
  3. 3. Visual Regression Testing
  4. 4. TW Radar (Jan/2014)
  5. 5. TW Radar (Jul/2014)
  6. 6. Motivação • Aumento do número de dispositivos, browsers e resoluções usadas para aplicações web • Diminuir esforço de testes manuais • Tornar refactor de CSS mais simples • Identificar, de forma fácil e rápida, defeitos que não seriam encontrados tão facilmente com testes manuais
  7. 7. Fonte: http://www.creativebloq.com/css3/4-tools-automatic-css-testing-7133777 (Simon Madine)
  8. 8. Usos • Comparar screenshots de versões da sua aplicação • Validar design responsivo • Validar valores de CSS
  9. 9. Ferramentas
  10. 10. Kobold
  11. 11. O que é? • Parte da solução de testes front-end com Node.js do Yahoo!, criada pelo Marcel Erz
  12. 12. http://yahooeng.tumblr.com/post/103124603756/simplified-fe-testing-with-selenium
  13. 13. Como funciona? • Kobold compara screenshots usando o Blink- diff, também criado pelo Marcel Erz (Yahoo!)
  14. 14. Testes na Nuvem
  15. 15. Por que testar na nuvem? • Não precisa se preocupar com infra-estrutura de VMs para testes em múltiplos ambientes • Serviços oferecem mais de 500 combinações de browser/OS • Setup simples • Execuções em paralelo dão feedback mais rápido (mas custam mais caro…)
  16. 16. Sauce Labs
  17. 17. BrowserStack
  18. 18. Hands-on
  19. 19. Hands-on • Estrutura do projeto de exemplo • Ver como as ferramentas se integram • Alterando o CSS e vendo o teste falhar • Vendo as imagens de diff (diretório highlight) • Projeto de exemplo no GitHub
  20. 20. Referências • Projeto de exemplo do hands-on - https://github.com/ stefanteixeira/fav-organizer/tree/master/test/visual • Projeto de exemplo criado pelo Marcel Erz - https:// github.com/marcelerz/preceptor-todomvc • Screencast da palestra do Marcel Erz no Selenium Meetup - https://vimeo.com/114172135
  21. 21. Globalcode – Open4education Obrigado! Stefan Teixeira stefanfk@gmail.com stefanteixeira.com.br @stefan_teixeira

×