Blog SW9

Desenvolvimento Web e Híbrido na prática.
Tome um café, concentre-se, codifique. (งツ)ว

Testando seu App AngularJS com Karma e Jasmine – Parte Final – SW9


Testando seu App AngularJS com Karma e Jasmine – Parte Final – SW9

Olá a todos.

Decidi lançar uma nova série, agora para falar sobre testes associados a Apps Web.

O Teste é uma das fases mais importantes do cliclo de desenvolvimento de um Software, seja ele para a Web, Desktop ou Mobile.

Eu digo a vocês que o teste é o grande aliado para identificarmos potenciais defeitos no código.

Já passou a época onde as pessoas desenvolviam os sistemas e para testá-los navegavam por todas as telas em busca de defeitos.
Essa pode ser uma alternativa, mas não é a única. Para realizarmos testes de qualidade, o mais correto é construirmos casos de teste
e aplicá-los de forma automática sempre que ocorrer uma alteração em nosso código.

Para esta primeira série sobre testes, vou focar no processo de testes de um App escrito em AngularJS. Como fazer isso? Como consigo criar testes
para validar os códigos escritos em AngularJS.

Para viabilizar a construção dos testes, vamos precisar de um framework de teste, que nada mais é do que um conjunto de features que vai nos permitir
codificar casos de teste. Para o caso do AngularJS o escolhido foi o framework Jasmine.

Mas só isso não é o suficiente, pois depois de codificar os casos de teste, precisamos executá-los para verificar se foram encontradas falhas no código.
É nesse momento que entre em jogo o que chamamos de ‘Test Runner’ ou Executores de Teste.

Alguns frameworks de teste, como por exemplo o ‘Mocha’, possuem um ‘test runner’ integrado, o que não é o caso do Jasmine, que depende de um ‘test runner’
de terceiros para a execução dos testes.

Para executar os testes escritos com o Jasmine, vamos utilizar o ‘test runner’ chamado Karma. Porque escolher o Karma? Porque ele é um ‘test runner’ desenvolvido
pelo time de desenvolvedores do AngularJS e portanto imaginamos a completa afinidade para executar testes em Apps escritos em AngularJS.

Com os pré-requisitos apresentados, partiremos para a codificação dos testes. A medida que formos construindo os casos de teste, vamos também construindo nosso App em AngularJS.

Neste último vídeo da série vou construir o último caso de teste que consiste em validar quando passamos um id de usuário inválido (que não existe na base de dados).
Neste caso, o comportamento que esperamos é o App nos direcionar para uma página de erro (Página 404).

Primeiro vamos começar construindo nosso controlador 404, nosso arquivo de teste e por último o arquivo html contendo a mensagem de erro. Para concluir,
vou completar o arquivo de teste do controlador [Contato] onde incluo o último caso de teste e valido o redirecionamento para a página de Erro.

Atenção especial para o roteamento em nosso App, onde uso o ui-router e não mais o ngRoute.

Espero que gostem deste último vídeo da série. Não deixem de comentar, curtir e se inscrever no blog ou canal youtube. A participação de vocês é muito importante para melhorarmos cada vez mais a qualidade das minhas publicações.

Antes de encerrar, vou deixar o link para baixar o código fonte completo.

Links

Código Fonte: http://blog.sw9.com.br/acesso-area-de-downloads/

Meu Blog: http://blog.sw9.com.br

Meu GitHub: https://sw9brl.github.io/MyGitHubPage

Canal youtube: youtube.com/+sw9brl

Http-Server: https://www.youtube.com/edit?o=U&video_id=59OG7vg4nYI

Playlist Completo: https://www.youtube.com/playlist?list=PLtluGZbI5ESht70-B9nXorCtN9vmr_Djo

Tópicos Relacionados

Deixe um comentário

Você pode usar estas tags e atributos de HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Paulo Eduardo
Geek desde criança, sempre me interessei por games, filmes e tecnologia. Sou graduado em engenharia da computação pela PUC Campinas. Possuo mais de 15 anos de experiência em desenvolvimento, com foco maior em desenvolvimento web, gestão de times e mais recentemente desenvolvimento mobile utilizando HTML e Javascript.

Termos como #backend, #frontend e #fullstack fazem parte do meu dia a dia.

Não deixe de acompanhar meu blog, canal youtube e meus produtos digitais.

Divirta-se e bons estudos. :-)
Paulo Eduardo on sabyoutubePaulo Eduardo on sabinstagramPaulo Eduardo on sabgithubPaulo Eduardo on sabfacebook
✌(◕‿-)✌ Tempo Limitado - Tenha acesso a nossa área de DownloadsClique Aqui - É Grátis
How to whitelist website on AdBlocker?