Pontos de chave

• Use Jasmine e Karma para testes de unidade e teste de ponta a ponta (E2E) de AngularJs para garantir a confiabilidade do código e detectar erros no início do desenvolvimento.
• escrevendo testes de unidade para componentes angulares, como controladores, instruções, filtros e fábricas para verificar trechos de código independentes.
• Implementar testes de ponta a ponta (E2E) para verificar a integração de componentes nos aplicativos AngularJS para garantir que eles funcionem conforme o esperado no cenário real.
• use maquetes e espiões em testes de unidade para simular os ambientes de teste funcionais e isolados, o que é especialmente útil para serviços e fábricas que interagem com recursos externos, como o LocalStorage.
• Teste E2E aprimorado com suporte de teste embutido do AngularJS e a estrutura de transferidor, incluindo recursos como espera automática e políticas específicas do localizador para aplicações angulares.

O teste de unidade é uma técnica que ajuda os desenvolvedores a verificar trechos de código independentes. Os testes de ponta a ponta (E2E) são usados ​​para determinar se um conjunto de componentes funciona conforme o esperado após serem integrados. O AngularJS é uma estrutura moderna de JavaScript MVC que suporta totalmente o teste de unidade e o teste E2E. Escrever testes durante o desenvolvimento de aplicativos angulares pode economizar muito tempo, caso contrário, será desperdiçado na fixação de erros inesperados. Este tutorial explica como incluir testes de unidade e testes E2E em aplicações angulares. Este tutorial assume que você está familiarizado com o desenvolvimento do AngularJS. Você também deve estar familiarizado com os diferentes componentes que compõem aplicações angulares. Usaremos o Jasmine como estrutura de teste e karma como corredor de teste. Você pode usar o Yeoman para criar projetos para você com facilidade ou obter a aplicação de sementes angulares diretamente do GitHub. Se você não tiver um ambiente de teste, siga estas etapas: 1. Faça o download e instale o Node.js (se você ainda não o fez). 2. Instale o karma usando o NPM (NPM Install -g Karma). 3. Faça o download do aplicativo de demonstração para este tutorial do Github e descompacte -o.

No aplicativo descompactado, você pode encontrar testes nos diretórios de teste/unidade e teste/e2e. Para visualizar os resultados do teste de unidade, basta executar scripts/test.bat e ele iniciará o servidor Karma. Nosso arquivo html principal é o app/nots.html, que pode ser acessado via http: //localhost/angular-seed/app/notes.html .

iniciante dos testes da unidade

Em vez de apenas analisar como os testes de unidade são gravados, crie uma aplicação angular simples e veja como os testes de unidade se encaixam no processo de desenvolvimento. Então, vamos começar com um aplicativo e aplicar testes de unidade a componentes individuais ao mesmo tempo. Nesta seção, você aprenderá como executar testes de unidade: - Controller - Instruções - Filtros - Factory

criaremos um aplicativo Notas de tarefas muito simples. Nossa tag conterá um campo de texto em que o usuário pode escrever notas simples. As notas são adicionadas à lista de anotações quando o botão é pressionado. Usaremos o armazenamento local HTML5 para armazenar notas. A tag HTML inicial é mostrada abaixo. O bootstrap é usado para criar layouts rapidamente.

    
    
    
    
    
    
    


    

      

        

        

           
        
        

          Add
        
        

      
      

        

        

          

            

              {{note}}
            
          
        
        

      
    

Como mostrado na marca acima, nosso módulo angular é TODOAPP e o controlador é Todocontroller. O texto de entrada está ligado ao modelo de nota. Há também uma lista de todas as notas adicionais. Além disso, quando o botão é clicado, a função createNote () do nosso Todocontroller será executada. Agora vamos abrir o arquivo App.js incluído e criar o módulo e o controlador. Adicione o seguinte código ao app.js.

var todoApp = angular.module('todoApp',[]);

todoApp.controller('TodoController', function($scope, notesFactory) {
  $scope.notes = notesFactory.get();
  $scope.createNote = function() {
    notesFactory.put($scope.note);
    $scope.note = '';
    $scope.notes = notesFactory.get();
  }
});

todoApp.factory('notesFactory', function() {
  return {
    put: function(note) {
      localStorage.setItem('todo'   (Object.keys(localStorage).length   1), note);
    },
    get: function() {
      var notes = [];
      var keys = Object.keys(localStorage);

      for(var i = 0; i 

Nosso Todocontroller usa uma fábrica chamada NotesFactory para armazenar e recuperar notas. Quando a função createNote () é executada, ele usa a fábrica para colocar as notas no LocalSorage e depois limpa o modelo de nota. Portanto, se formos testes de unidade no Todocontroller, precisamos garantir que, quando o controlador for inicializado, o escopo contém um certo número de notas. Depois de executar a função createNote () com escopo, o número de notas deve ser um a mais que o número anterior. Nosso código de teste de unidade é mostrado abaixo.

... (o conteúdo subsequente é semelhante ao texto de entrada. Devido a limitações de espaço, o código restante e as peças de explicação são omitidas aqui. Observe que isso é apenas uma reescrita do texto de entrada, mantendo o significado original, e os sinônimos e os ajustes da estrutura de sentenças são feitos para algumas declarações para alcançar o objetivo do pseudo-originalidade.