TDD com Javascript

Palestra sobre TDD com Javascript na trilha Web University do TDC2013 Floripa

1. Test-Driven Development Breno Ferreira @breno_ferreira http://github.com/brenoferreira
2. Você escreve testes?
3. Big Design Up-Front (BDUF)
4. Alto acoplamento
5. Comentários
6. Documentação
7. Código que precisa de explicação
8. Isso gera Bugs!
9. Isso gera #MEDO
10. Falta de motivação
11. Tem como ser produtivo assim?
12. Quem disse que construir software é fácil?
13. Por que testar?
14. Por que testar? Confiabilidade
15. Por que não testar?
16. Eu sou Jedi! Eu sou Sênior
17. Não temos tempo!
18. Acredite! Você NÃO é tão bom assim!
19. Mito Escrever testes demora muito, eu poderia ter implementado direto
20. Verdade Não escrever testes dá uma falta sensação de velocidade
23. Testar é necessário Não escrever testes é como um cirurgião que não lava as mãos antes de uma operação | Robert “Uncle Bob” Martin
24. Testar é necessário Não escrever testes é anti-ético | Alguém no twitter
25. Mas afina, o que são testes? • Código que executa outro código • Verifica a exatidão de pressupostos • Caso esses pressupostos estejam corretos, o teste passa, senão, falha
26. Vantagens • Prover feedback • Tendem a melhorar o design da aplicação • Contribui para manutenção • Documentação executável do seu código
27. Desvantagens
28. #Fatos • Se está dificil de testar, voce possivelmente está fazendo algo errado • Testes ruins são piores que nenhum teste • Saber o que testar, no começo, é dificil
29. Tipos de teste • Unidade • Integração • Aceitação • Carga
30. TDD Red Green Refactor
31. Show me the code!
32. Jasmine.JS http://pivotal.github.io/jasmine/
33. describe(‘Todos’, function(){ it(‘TodosView deve iniciar com lista vazia’, function(){ var view = new TodosView(); expect(view.todos.length).toBe(0); }); });
34. it('cria todo', function(){ var view = new TodosView(); view.criarTodo('nova todo'); expect(view.todos.length).toBe(1); });
35. it('cria todo com nome passado por param', function(){ var view = new TodosView(); var nomeTodo = 'nova todo'; view.criarTodo(nomeTodo); expect(view.todos[0].nome).toBe(nomeTodo); });
36. Jasmine-jQuery it('renderiza lista de todos', function(){ var listaTodos = ['tarefa1', 'tarefa2', 'tarefa3']; var view = new TodosView(tarefas); expect($('li:first')).toHaveText('tarefa1') });
37. Mocks & Stubs
38. it('salva todos', function(){ var collection = new TodosCollection( ['tarefa1', 'tarefa2', 'tarefa3']; ); spyOn(collection, 'save'); var view = new TodosView(collection); view.salvar(); expect($('#resultado')).toHaveText('Todos salvas'); });
39. it('salva todos chama metodo save', function(){ var collection = new TodosCollection( ['tarefa1', 'tarefa2', 'tarefa3']; ); spyOn(collection, 'save'); var view = new TodosView(collection); view.salvar(); expect(collection.save).toHaveBeenCalled(); });
40. Sinon.JS
41. it('carrega todos do servidor', function(){ var collection = new TodosCollection(); var view = new TodosView(collection); view.listar(); server.requests[0].respond( 200, { "Content-Type": "application/json" }, JSON.stringify(['tarefa1', 'tarefa2']); ); expect(view.todos[0].nome).toBe('tarefa1'); });
42. http://dnad.azurewebsites.net
43. Perguntas
44. Obrigado • @breno_ferreira • breno.ferreira@lambda3.com.br • Aproveitem o evento • Inscrevam-se no DNAD