2017-01-23 1 views
1

Я пишу простой веб-приложение AngularJS 1.x.AngualrJS с кармой - как я могу написать единичный тест для завода?

У меня есть модуль:

main.js:

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

factory.js

app.factory('DataFactory', function(){ 

    var DataService = {}; 

    DataService.something = function() { 
    return 5; 
    }; 

    return DataService; 

}); 

controller.js

app.controller('DataController', function ($scope, DataFactory) { 
    $scope.searchText = null; 
    $scope.results = DataFactory.something(); 
}); 

index.html:

<!DOCTYPE html> 

<html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
</script> 
    </head> 
    <body ng-app="app" ng-controller="DataController"> 
     <script src="app.js"></script> 
     <script src="factory.js"></script> 
     <script src="controller.js"></script> 
    </body> 
</html> 

тестовый файл:

describe('Data Factory Test', function() { 

    var Factory; 

    beforeEach(function() { 
     angular.module('app'); 
    }); 

    beforeEach(inject(function() { 
     var $injector = angular.injector(['app']); 
     Factory = $injector.get('DataFactory'); 
    })); 

    it('is very true', function(){ 
     expect(Factory).toBeDefined(); 
     // var output = Factory.something(); 
     // expect(output).toEqual(5); 
    }); 

    }); 

karma.conf.js:

frameworks: ['jasmine'], 


// list of files/patterns to load in the browser 
files: [ 
    'node_modules/angular/angular.js', 
    'node_modules/angular-mocks/angular-mocks.js', 
    'app.js', 
    'factory.js', 
    'controller.js', 
    'test/*.js' 
] 

Как написать модульный тест, чтобы проверить, если завод существует, и проверить возвращение чего-то ?

я получаю сообщение об ошибке, когда я запускаю старт карма: Ошибка: [$ Инжектор: modulerr] Не удалось создать экземпляр модуля приложения из-за: Ошибка: [$ Инжектор: unpr] Неизвестный поставщик: $ controllerProvider

Редактировать: Я получил его работу. Как я могу написать модульный тест для контроллера с фабрикой и без нее?

+0

Пожалуйста, после того, что у вас есть в тестовой спецификации, а также. –

+0

В тесте - у вас есть 'OlympicDataFactory', но в коде, который вы используете' DataFactory', - с правильным? –

ответ

0

Вам нужно позвонить angular.injector:

'use strict'; 

(function() { 
    describe('Factory Spec', function() { 

    var Factory; 

    beforeEach(function() { 
     angular.module('app'); 
    }); 

    beforeEach(inject(function() { 
     var $injector = angular.injector(['app']); 
     Factory = $injector.get('DataFactory'); 
    })); 

    it('is very true', function(){ 
     var output = Factory.something(); 
     expect(output).toEqual(5); 
    }); 

    }); 
    }()); 

Чтобы проверить контроллер:

describe('PasswordController', function() { 
    beforeEach(module('app')); 

    var $controller; 

    beforeEach(inject(function(_$controller_){ 
    // The injector unwraps the underscores (_) from around the parameter names when matching 
    $controller = _$controller_; 
    })); 

    describe('$scope.grade', function() { 
    it('sets the strength to "strong" if the password length is >8 chars', function() { 
     var $scope = {}; 
     var controller = $controller('PasswordController', { $scope: $scope }); 
     $scope.password = 'longerthaneightchars'; 
     $scope.grade(); 
     expect($scope.strength).toEqual('strong'); 
    }); 
    }); 
}); 

От here;

+0

У меня есть ошибка: Ошибка: [$ injector: modulerr] Не удалось создать приложение модуля из-за: Ошибка: [$ injector: unpr] Неизвестный поставщик: $ controllerProvider – user1261710

+2

Это означает, что вы не разместили весь свой код и там является контроллером где-то, что тоже должно быть издевательствовано @ user1261710 – Yaser

+0

Как бы это сделать для контроллера? – user1261710

2

Первая часть показывает, как можно проверить обслуживание/завод. Вторая часть показывает два способа тестирования контроллера

  • мы просто ожидали, что некоторые переменные из $ объема были изменены
  • мы ожидаем, что некоторые службы/завод был назван

Вероятно, все эти виды тестов охватывает все наши потребности.

angular.module('app', []).factory('DataFactory', function() { 
 

 
    var DataService = {}; 
 

 
    DataService.something = function() { 
 
    return 5; 
 
    }; 
 

 
    return DataService; 
 

 
}).controller('DataController', function($scope, DataFactory) { 
 
    $scope.searchText = null; 
 
    $scope.results = DataFactory.something(); 
 
}); 
 

 
describe('Data Factory Test', function() { 
 
    var Factory; 
 

 
    beforeEach(module('app')); 
 

 
    beforeEach(inject(function(_DataFactory_) { 
 
    Factory = _DataFactory_ 
 
    })); 
 

 
    it('is very true', function() { 
 
    expect(Factory).toBeDefined(); 
 
    var output = Factory.something(); 
 
    expect(output).toEqual(5); 
 
    }); 
 
}); 
 

 
describe('DataController ', function() { 
 

 
    var $scope, instantiateController, DataFactory 
 

 
    beforeEach(module('app')); 
 

 
    beforeEach(inject(function($rootScope, $controller, _DataFactory_) { 
 
    $scope = $rootScope.$new() 
 
    DataFactory = _DataFactory_ 
 
    instantiateController = function() { 
 
     $controller('DataController', { 
 
     $scope: $scope, 
 
     DataFactory: DataFactory 
 
     }) 
 
    } 
 
    })) 
 

 
    // It shows that controller chenges $scope.results 
 
    it('Calculates results', function() { 
 
    expect($scope.results).toBe(undefined) 
 
    instantiateController() 
 
    expect($scope.results).toBe(5) 
 
    }) 
 

 
    // It shows that DataFactory was called 
 
    it('Calls `DataFactory.something`', function() { 
 
    spyOn(DataFactory, 'something'); 
 
    instantiateController() 
 
    expect(DataFactory.something).toHaveBeenCalled() 
 
    }) 
 
});
<link href="//safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine.css" rel="stylesheet" /> 
 
<script src="//safjanowski.github.io/jasmine-jsfiddle-pack/pack/jasmine-2.0.3-concated.js"></script> 
 
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script> 
 
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular-mocks.js"></script>

+2

+1 в обозначении подчеркивания. В случае, если кто-нибудь задается вопросом: «Обозначение подчеркивания: использование знака подчеркивания (например: _ $ rootScope_) - это широкое распространение в сообществе AngularJS, чтобы сохранить имена переменных в ваших тестах. Вот почему инжектор $ выделяет ведущие и завершающие символы подчеркивания при согласовании параметров. Правило подчеркивания применяется только в том случае, если имя начинается и заканчивается ровно одним подчеркиванием, в противном случае никакой замены не происходит. ' –

+0

Спасибо за это! Как я могу написать единичный тест для контроллера? Не могли бы вы добавить его к своему ответу? – user1261710

+0

Было добавлено некоторое доказательство того, что контроллер может быть протестирован. –