Este documento discute testes de interface do usuário (UI) e JavaScript, incluindo testes de unidade para JavaScript. Ele descreve ferramentas como Selenium e Karma para automatizar testes de UI e de unidade, respectivamente, e serviços de nuvem como Sauce Labs e BrowserStack para executar testes em vários navegadores e sistemas operacionais. O documento também aborda a importância de testes manuais.

1. Testando na Nuvem a UI
e o JavaScript de sua
aplicação
Stefan Teixeira
@stefan_teixeira
stefanfk@gmail.com
stefanteixeira.com.br
stefanteixeira.com

2. About me
Stefan Teixeira
• QA Engineer @ M4U
• Entusiasta de Automação de Testes, Agile Testing e
DevOps
• Blogs técnicos: stefanteixeira.com.br (pt-br) /
stefanteixeira.com (en)
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. Vocês automatizam
testes?

4. (a) Não, testes são para os fracos

5. (b) Sim! Assim como a zoeira, a
automação não tem limites!

6. Pirâmide de
Automação de Testes

7. Pirâmide de Automação de Testes
Mike Cohn - Succeeding With Agile

9. Cuidado!

10. Testes de UI são mais lentos!

13. Testes de UI

14. • União de dois projetos:
• Selenium (Jason Huggins -
ThoughtWorks)
Selenium WebDriver

15. • União de dois projetos:
• Selenium (Jason Huggins -
ThoughtWorks)
• WebDriver (Simon Stewart - Google)
Selenium WebDriver

16. • União de dois projetos:
• Selenium (Jason Huggins -
ThoughtWorks)
• WebDriver (Simon Stewart - Google)
• Framework mais utilizado para
testes de UI
Selenium WebDriver

17. • União de dois projetos:
• Selenium (Jason Huggins - ThoughtWorks)
• WebDriver (Simon Stewart - Google)
• Framework mais utilizado para
testes de UI
• Padrão W3C (http://www.w3.org/TR/
webdriver/)
Selenium WebDriver

18. Fonte: http://pt.slideshare.net/ThoughtWorks/selenium-workshopbrasil-pdf

19. Fonte: http://pt.slideshare.net/ThoughtWorks/selenium-workshopbrasil-pdf

20. Testes de Unidade

21. +
OU OU
Testes de Unidade para JS

22. Karma
• Criado pelo Vojta Jína (na época,
da equipe do AngularJS)

23. Karma
• Criado pelo Vojta Jína (na época,
da equipe do AngularJS)
• Executa os testes (de unidade)
em browsers reais, permitindo
identificar incompatibilidades
entre seu código/libs e browsers

24. Karma
• Feature de “watch" oferece
feedback imediato dos testes a
cada save em um script

25. Karma
• Feature de “watch" oferece
feedback imediato dos testes a
cada save em um script
• Integração muito simples com libs
de cobertura de código (Istanbul)
ou mocks/stubs/spies (Sinon.js)

26. Karma: Browsers

27. Testes na Nuvem

28. Por que testar na nuvem?
• Zero estresse com infraestrutura
de VMs para testar em múltiplos
ambientes

29. Por que testar na nuvem?
• Zero estresse com infraestrutura
de VMs para testar em múltiplos
ambientes
• Serviços oferecem mais de 500
combinações de browser/OS

30. Por que testar na nuvem?
• Setup simples

31. Por que testar na nuvem?
• Setup simples
• Execuções em paralelo te dão
feedback mais rápido

32. Por que testar na nuvem?
• Setup simples
• Execuções em paralelo te dão
feedback mais rápido
• (mas custam mais caro)

33. Sauce Labs

34. BrowserStack

35. Sauce Labs x BrowserStack
• Documentação

36. Sauce Labs x BrowserStack
• Documentação
• Valores

37. Sauce Labs x BrowserStack
• Documentação
• Valores
• Features

38. Sauce Labs x BrowserStack
• Documentação
• Valores
• Features
• Túnel SSL

39. Sauce Labs: Pricing

40. BrowserStack: Pricing

41. Mas e os testes
manuais?

42. Testes Manuais
• Ambos os serviços oferecem
ambientes para testes manuais

43. Testes Manuais
• Ambos os serviços oferecem
ambientes para testes manuais
• BrowserStack possui, inclusive,
emuladores de Windows Phone
para testes manuais!

44. Hands-on

47. Hands-on: Vídeos
• Demo Selenium: https://
www.youtube.com/watch?
v=3RzHd817anY
• Demo Karma: https://
www.youtube.com/watch?
v=1LFHoYaSY00

48. Hands-on: Código-fonte
• Exemplo Selenium: https://
github.com/stefanteixeira/
exemplo-selenium-nuvem
• Exemplo Karma: https://
github.com/stefanteixeira/fav-
organizer

49. Livros recomendados

50. Obrigado!
Stefan Teixeira
@stefan_teixeira
stefanfk@gmail.com
stefanteixeira.com.br
stefanteixeira.com