Just started learning angular. Because i like its unit testing power, i decided to try Karma/Jasmine unit testing on it.
this was my first test app:
angular.module('notesApp')
.controller('ListCtrl', [function() {
var self = this;
self.items = [
{id: 1, label: 'First', done: true},
{id: 2, label: 'Second', done: false}
];
self.getDoneClass = function(item) {
return {
finished: item.done,
unfinished: !item.done
};
}; }]);
this was my unit test app:
describe('Controller: ListCtrl', function() {
beforeEach(module('notesApp'));
var ctrl;
beforeEach(inject(function($controller) { ctrl = $controller('ListCtrl'); }));
it('should have items available on load', function() {
expect(ctrl.items).toEqual([
{id: 1, label: 'First', done: true},
{id: 2, label: 'Second', done: false}
]);
});
it('should have highlight items based on state', function() {
var item = {id: 1, label: 'First', done: true};
var actualClass = ctrl.getDoneClass(item);
expect(actualClass.finished).toBeTruthy();
expect(actualClass.unfinished).toBeFalsy();
item.done = false;
actualClass = ctrl.getDoneClass(item);
expect(actualClass.finished).toBeFalsy();
expect(actualClass.unfinished).toBeTruthy();
});
});
And it worked fine. But once i tried to test my application which had routing configuration (application was working in browser, i just wanted to test it in unit tests), it started throwing injection errors once tests started. So i copied this first application that was working and just added config with routing to it and it started to fail tests again.
angular.module('notesApp', ['ngRoute'])
app.config(function ($routeProvider, $locationProvider) {
$routeProvider
.when("/", {
templateUrl: "/Templates/index-partial.html"
}).when("/details", {
templateUrl: "/Templates/details-partial.html"
}).when("/create", {
templateUrl: "/Templates/create-partial.html"
}).when("/edit", {
templateUrl: "/Templates/edit-partial.html"
}).when("/delete", {
templateUrl: "/Templates/delete-partial.html"
}).otherwise({
templateUrl: "/Templates/index-partial.html"
});
// use the HTML5 History API
$locationProvider.html5Mode({
enabled: true,
requireBase: false
});
})
.controller('ListCtrl', [function() {
var self = this;
self.items = [
{id: 1, label: 'First', done: true},
{id: 2, label: 'Second', done: false}
];
self.getDoneClass = function(item) {
return {
finished: item.done,
unfinished: !item.done
};
}; }]);
I did include all dependencies in karma config file. Actually I included every angular script just to make sure.
'../Scripts/angular.js',
'../Scripts/angular-route.js',
'../Scripts/angular-sanitize.js',
'../Scripts/angular-cookies.js',
'../Scripts/ui-bootstrap.js',
'../Scripts/ui-bootstrap-tpls.js',
'../Scripts/angular-mocks.js',
'../Scripts/angular-resource.js',
'../Modules/myApp.js',
'../Modules/myApp_UT.js'
Now i don't know what Im doing wrong and i would love some guidelines because im stuck :|
One of Errors that is shown in karma debug page : [$injector:unpr] Unknown provider: $scopeProvider <- $scope
Link to error: http://ift.tt/1mIXjei$injector/unpr?p0=$scopeProvider%20%3C-%20$scope%20%3C-%20ReadListCtrl
There are multiple other erros but I think most of them are there because controller couldn't be created properly.
Aucun commentaire:
Enregistrer un commentaire