Using Karma Im back filling tests on a project (someone else wrote the angular app - I have the 'pleasure')...
Project written in coffeescript.
I have the following jasmine test:
'use strict'
describe 'module:file:controller', () ->
$controller = null
$scope = null
$state = null
$stateParams = null
Page = null
File = null
beforeEach (module 'forge')
beforeEach inject(($rootScope, _$controller_, _$state_, _$stateParams_, _Page_, _File_) ->
$scope = $rootScope.$new()
$state = _$state_
$stateParams = _$stateParams_
Page = _Page_
File = _File_
$controller = _$controller_
)
describe 'init', () ->
controller = null
beforeEach () ->
$state = {}
$stateParams = {}
controller = $controller('fileController', {$scope: $scope, $state: $state, $stateParams: $stateParams, Page: Page, File: File})
it 'should set page title to File', () ->
spyOn(Page, 'title')
expect(Page.title).toHaveBeenCalledWith 'Files'
it 'should do something with delete', () ->
spyOn(Page, 'addAlert')
$scope.delete(1)
expect(Page.addAlert).toHaveBeenCalled()
Here is the controller:
forge.controller 'fileController', ($scope, $state, $stateParams, Page, File) ->
# Inject base controller
$injector.invoke BaseController, this, { $scope: $scope, Factory: File }
# Set page title
Page.title 'Files'
console.log $stateParams
console.log $state
# Delete
$scope.delete = (id) ->
Page.addAlert 'success', '[TEST] Deleting file...'
console.log $stateParams
console.log $state
# Delegate actions
switch $stateParams.action
when 'delete' then $scope.delete $stateParams.id
I have a bunch of unit test running fine. The application is built using grunt and all code is compiled into /dist/assets/js/app.js.
My karma config:
module.exports = (config) ->
config.set
files: [
'../../dist/assets/js/app.js'
'../../bower_components/angular-mocks/angular-mocks.js'
'unit/**/**.test.coffee'
'../module/**/test/unit/**/*.unit.coffee'
]
preprocessors:
'unit/**/**.test.coffee': ['coffee']
'../module/**/test/unit/**/*.unit.coffee': ['coffee']
frameworks: ['jasmine']
reporters: ['progress']
browsers: ['Chrome', 'Firefox', 'Safari']
logLevel: 'ERROR'
jasmineNodeOpts:
onComplete: null
isVerbose: false
showColors: true
includeStackTrace: false
defaultTimeoutInterval: 30000
When I run the tests I receive:
Chrome 48.0.2564 (Mac OS X 10.11.3) module:file:controller init should set page title to File FAILED
ReferenceError: $injector is not defined
at new <anonymous> (/Users/usr1/repos/proj/dist/assets/js/forge.js:75397:3)
at Object.instantiate (/Users/usr1/repos/proj/dist/assets/js/forge.js:14449:14)
at /Users/usr1/repos/proj/dist/assets/js/forge.js:19700:28
at /Users/usr1/repos/proj/bower_components/angular-mocks/angular-mocks.js:2170:12
at Object.<anonymous> (/Users/usr1/repos/proj/src/module/file/test/unit/controller/file-controller.unit.js:25:27)
Expected spy title to have been called with [ 'Files' ] but it was never called.
at Object.<anonymous> (/Users/usr1/repos/proj/src/module/file/test/unit/controller/file-controller.unit.js:35:33)
Chrome 48.0.2564 (Mac OS X 10.11.3) module:file:controller init should do something with delete FAILED
ReferenceError: $injector is not defined
at new <anonymous> (/Users/usr1/repos/proj/dist/assets/js/forge.js:75397:3)
at Object.instantiate (/Users/usr1/repos/proj/dist/assets/js/forge.js:14449:14)
at /Users/usr1/repos/proj/dist/assets/js/forge.js:19700:28
at /Users/usr1/repos/proj/bower_components/angular-mocks/angular-mocks.js:2170:12
at Object.<anonymous> (/Users/usr1/repos/proj/src/module/file/test/unit/controller/file-controller.unit.js:25:27)
TypeError: $scope.delete is not a function
at Object.<anonymous> (/Users/usr1/repos/proj/src/module/file/test/unit/controller/file-controller.unit.js:39:23)
Chrome 48.0.2564 (Mac OS X 10.11.3): Executed 63 of 63 (2 FAILED) (1.155 secs / 1.134 secs)
Checked all the paths and that the controllers are presentin teh built app.js file.
At a loss now as to why this message persists and any pointers would be great.
My application was minified - this would prevent this working.
angular injector docs.
Related
Whoever said that testing Angular apps is a breeze had to be joking. Since I started writing tests for our Angular application, I consider it a great success when I move from one error message to another when running karma. Most of the examples online seem to be simplified and are not really transferable to my error cases. Now, onto the current problem I have:
I have angular-mocks.js and other angular dependencies hooked up in karma.conf.js file, I have tested config block of our app (controllers and templates matching routes) and the tests are green. Now I am trying to test controller which has $watchGroup - for some bloody reason $watchGroup is undefined (and also $watch when I tried to use it) in my jasmine test. When I comment the $watchGroup out my dummy test expect(true).toBe(true) is green, but with $watchGroup code in the controller (which is working fine btw) karma console reports that $watchGroup is undefined.
This is the code in the controller:
$scope.$watchGroup([
'Message.AgeRangeMin',
'Message.AgeRangeMax',
'Message.SubscriberListFileId',
'Message.SmsSettings.SelectedSender',
'Message.EmailSettings.SelectedTemplate',
'Message.PushSettings.SelectedSenders.length',
'Message.SocialSettings.SelectedSocialNetworks.length'
], $scope.triggerUserForecast
);
$scope.triggerUserForecast = function () {
commsMgmtHttpService.GetTotalReach($scope.Message)
.then(function (data) {
$scope.UserDeliveryForecast = data;
}, function () {
$scope.UserDeliveryForecast.TotalUserReach = 0;
});
};
This is my test case:
describe('forge.communications.CommsApp', function () {
beforeEach(module('forge.communications.CommsApp'));
describe('CreateScheduledMessageController', function () {
var ctrl, $scope, $rootScope, $controller, $httpBackend;
beforeEach(function () {
inject(function (_$rootScope_, _$controller_, _$httpBackend_) {
$rootScope = _$rootScope_;
$scope = $rootScope.$new();
$httpBackend = _$httpBackend_;
$controller = _$controller_('CreateScheduledMessageController', {
$scope: $scope,
$scope: {
ModelState: new ModelState($scope)
},
$location: $location,
$modal: $modal,
$upload: $upload
});
})
});
it("dummy should be true", function () {
expect(true).toBe(true);
});
});
});
This is the Karma console error I am getting:
Chrome 40.0.2214 (Windows 7) forge.communications.CommsApp CreateScheduledMessageController dummy should be defined FAILED TypeError: undefined is not a function at new (C:/work/theforge/src/TheForge/dist/CommsApp.js:2581:12) at invoke (C:/work/theforge/src/TheForge/Scripts/angular.js:4118:17) at Object.instantiate (C:/work/theforge/src/TheForge/Scripts/angular.js:4129:23) at C:/work/theforge/src/TheForge/Scripts/angular.js:8320:28 at Object. (C:/work/theforge/src/TheForge/FrontEndTests/CommsAppTests/unit/Controllers/CreateScheduledMessage/CreateScheduledMessageController.spec.js:31:31) at Object.invoke (C:/work/theforge/src/TheForge/Scripts/angular.js:4118:17) at Object.workFn (C:/work/theforge/src/TheForge/Scripts/angular-mocks.js:2257:20) at window.inject.angular.mock.inject (C:/work/theforge/src/TheForge/Scripts/angular-mocks.js:2229:37) at Object. (C:/work/theforge/src/TheForge/FrontEndTests/CommsAppTests/unit/Controllers/CreateScheduledMessage/CreateScheduledMessageController.spec.js:22:13) Error: Declaration Location at window.inject.angular.mock.inject (C:/work/theforge/src/TheForge/Scripts/angular-mocks.js:2228:25)at Object. (C:/work/theforge/src/TheForge/FrontEndTests/CommsAppTests/unit/Controllers/CreateScheduledMessage/CreateScheduledMessageController.spec.js:22:13) Chrome 40.0.2214 (Windows 7): Executed 15 of 15 (1 FAILED) (0 secs / 0.12 secs) WARN [web-server]: 404: /forge/signalr/negotiate?clientProtocol=1.4&connectionDaChrome 40.0.2214 (Windows 7): Executed 15 of 15 (1 FAILED) (0.415 secs / 0.12 secs)
Any advice will be of much help to me.
Thanks.
It looks like I was overwriting the $controller's $scope property in jasmine test. Removing the following lines of code, following #Chandermani's advice fixed my problem.
$scope: {
ModelState: new ModelState($scope)
}
I've just started to discover angular unit testing mysteries using Karma & Jasmine and I have some problems with controllers tests. I've wrote tests to see if variables are defined: expect(scope.someVariable).toBeDefined(). Everything worked as expected ( every test was successfully ) untill I've added ng-scenario in karma.conf.js file.
I'm using node to run tests.
Problem: After adding ng-scenario in karma configuration file as framework all tests for checking if scope variables are defined are failing. Before adding ng-scenario all tests were successfully. Do you have any ideea why is this happening ?
Karma Conf file:
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['ng-scenario','jasmine'],
files: [ 'app/plugins/jquery/jquery.js',
'app/plugins/angular/angular.js', 'app/plugins/angular-scenario/angular-scenario.js',
'app/plugins/angular-mocks/angular-mocks.js',
'app/plugins/angular-resource/angular-resource.js',
'app/plugins/angular-cookies/angular-cookies.js',
'app/plugins/angular-sanitize/angular-sanitize.js',
'app/plugins/angular-route/angular-route.js', 'app/plugins/angular-utf8-base64/angular-utf8-base64.js',
'app/scripts/*.js',
'app/scripts/**/*.js',
'test/**/*.js',
'app/views/templates/*.html'
],
preprocessors : { 'app/views/templates/*.html': 'html2js' },
exclude: ['app/plugins/angular-scenario/angular-scenario.js'],
port: 8080,
logLevel: config.LOG_INFO,
autoWatch: false,
browsers: ['Chrome'],
singleRun: false }); };
Controller test:
'use strict'
describe('Controller: MainCtrl', function () {
beforeEach(module('qunizGameApp'));
var MainCtrl,scope, configService,feedbackService,authService,notify,resourceService;
beforeEach(inject(function ($controller, $rootScope,_configService_,_feedbackService_, _authService_,_notify_, _resourceService_) {
scope = $rootScope.$new();
MainCtrl = $controller('MainCtrl', {
$scope: scope,
configService:_configService_,
feedbackService:_feedbackService_,
authService:_authService_,
notify:_notify_,
resourceService:_resourceService_
});
configService=_configService_;
feedbackService=_feedbackService_;
authService=_authService_;
notify=_notify_;
resourceService=_resourceService_; }));
it('should be defined -configService', function () {
expect(scope.configService).toBeDefined();
});
it('should be defined - resourceService', function () {
expect(scope.resourceService).toBeDefined();
});
it('should be defined - sidebarVisible', function () {
expect(scope.sidebarVisible).toBeDefined(); });
});
Proof of working test before including ng-scenario:
Proof of failure test after including ng-scenario:
And a wierd thing is that if I debug the test in my chrome console, variables are defined:
Things read on interned and tried:
1.I've tried to define variables on scope in beforeEach section as a mock data.
2.I've tried to inject all other controller dependencies ( with undescored name as paramaters)
You can see 1 and 2 below
beforeEach(inject(function ($controller, $rootScope,_configService_,_feedbackService_, _authService_,_notify_, _resourceService_) {
scope = $rootScope.$new();
scope.configService=_configService_;
scope.authService=_authService_;
scope.resourceService=_resourceService_;
scope.sidebarVisible={};
MainCtrl = $controller('MainCtrl', {
$scope: scope,
configService:_configService_,
feedbackService:_feedbackService_,
authService:_authService_,
notify:_notify_,
resourceService:_resourceService_
});
configService=_configService_;
feedbackService=_feedbackService_;
authService=_authService_;
notify=_notify_;
resourceService=_resourceService_; }));
But scope.configService, scope.resourceService and scope.sidebarVisible are still undefined at the moment of test
I had the same problems with ng-scenario when using it with Karma. The moment I included it in karma.conf.js file, none of my tests was passing. Just don't use ng-scenario - use Protractor for integration testing. https://github.com/angular/protractor
I'm new to Karma and Jasmine, and wanted to get some assistance trying to use grunt test on controllers. The error I get when I run the test is (shortened):
Running "karma:unit" (karma) task
INFO [karma]: Karma v0.10.9 server started at http://localhost:8080/
INFO [launcher]: Starting browser Chrome
WARN [watcher]: Pattern "/Users/doronkatz/Development/Angular/Chapter4/test/mock/**/*.js" does not match any file.
INFO [Chrome 31.0.1650 (Mac OS X 10.9.1)]: Connected on socket 34BLydt6tI-UpBXZQBCZ
Chrome 31.0.1650 (Mac OS X 10.9.1) Controllers ListCtrl should have list of recipes FAILED
Error: [ng:areq] Argument 'ListCtrl' is not a function, got undefined
http://errors.angularjs.org/1.2.6/ng/areq?p0=ListCtrl&p1=not%20a%20function%2C%20got%20undefined
at /Users/doronkatz/Development/Angular/Chapter4/app/bower_components/angular/angular.js:78:12
at assertArg (/Users/doronkatz/Development/Angular/Chapter4/app/bower_components/angular/angular.js:1360:11)
at assertArgFn (/Users/doronkatz/Development/Angular/Chapter4/app/bower_components/angular/angular.js:1370:3)
at /Users/doronkatz/Development/Angular/Chapter4/app/bower_components/angular/angular.js:6755:9
at null.<anonymous> (/Users/doronkatz/Development/Angular/Chapter4/test/spec/controllers/controllers.js:21:14)
at Object.invoke (/Users/doronkatz/Development/Angular/Chapter4/app/bower_components/angular/angular.js:3697:17)
at workFn (/Users/doronkatz/Development/Angular/Chapter4/app/bower_components/angular-mocks/angular-mocks.js:2102:20)
Error: Declaration Location
at window.inject.angular.mock.inject (/Users/doronkatz/Development/Angular/Chapter4/app/bower_components/angular-mocks/angular-mocks.js:2087:25)
at null.<anonymous> (/Users/doronkatz/Development/Angular/Chapter4/test/spec/controllers/controllers.js:17:16)
at null.<anonymous> (/Users/doronkatz/Development/Angular/Chapter4/test/spec/controllers/controllers.js:13:3)
at /Users/doronkatz/Development/Angular/Chapter4/test/spec/controllers/controllers.js:1:1
Expected undefined to equal [ 1, 2, 3 ].
Error: Expected undefined to equal [ 1, 2, 3 ].
at null.<anonymous> (/Users/doronkatz/Development/Angular/Chapter4/test/spec/controllers/controllers.js:28:30)
Chrome 31.0.1650 (Mac OS X 10.9.1) Controllers EditController should save the recipe FAILED
...
Controllers.js test:
describe('Controllers', function() {
var $scope, ctrl;
//you need to indicate your module in a test
beforeEach(module('chapter4App',
['directives', 'services']));
beforeEach(function() {
this.addMatchers({
toEqualData: function(expected) {
return angular.equals(this.actual, expected);
}
});
});
describe('ListCtrl', function() {
var mockBackend, recipe;
// The _$httpBackend_ is the same as $httpBackend. Only written this way to
// differentiate between injected variables and local variables
beforeEach(inject(function($rootScope, $controller, _$httpBackend_, Recipe) {
recipe = Recipe;
mockBackend = _$httpBackend_;
$scope = $rootScope.$new();
ctrl = $controller('ListCtrl', {
$scope: $scope,
recipes: [1, 2, 3]
});
}));
it('should have list of recipes', function() {
expect($scope.recipes).toEqual([1, 2, 3]);
});
});
Please look at https://github.com/doronkatz/angularjs-book/tree/master/chapter4 which has the code, including test script for the controller, and controller.
4th line:
WARN [watcher]: Pattern "/Users/doronkatz/Development/Angular/Chapter4/test/mock/*/.js" does not match any file.
Sooo, maybe You dont load all required files?
I am trying to write Karma tests for an Angular app. This test is failing:
describe('Controller: AdherenceCtrl', function () {
// load the controller's module
beforeEach(module('myApp'));
var MainCtrl,
scope;
// Initialize the controller and a mock scope
beforeEach(inject(function ($controller, $rootScope) {
// do nothing for the moment
// scope = $rootScope.$new();
// MainCtrl = $controller('AdherenceCtrl', {
// $scope: scope
// });
}));
it('should pass a basic test', function () {
expect([1,2].length).toBe(2);
});
});
If I delete the beforeEach(inject section, though, it passes.
describe('Controller: AdherenceCtrl', function () {
// load the controller's module
beforeEach(module('myApp'));
var MainCtrl,
scope;
it('should pass a basic test', function () {
expect([1,2].length).toBe(2);
});
});
What is wrong with the beforeEach(inject section?
The error message I get from Karma is this, which I cannot parse:
Chrome 31.0.1650 (Mac OS X 10.9.0) Controller: AdherenceCtrl should pass a basic test FAILED
Error: [$injector:modulerr] http://errors.angularjs.org/undefined/$injector/modulerr?p0=astellasRiskfactorcalcAppApp&p1=Error%3A%20%5B%24injector%3Amodulerr%5D%20http%3A%2F%2Ferrors.angularjs.org%2Fundefined%2F%24injector%2Fmodulerr%3Fp0%3DngRoute%26p1%3DError%253A%2520%255B%2524injector%253Anomod%255D%2520http%253A%252F%252Ferrors.angularjs.org%252Fundefined%252F%2524injector%252Fnomod%253Fp0%253DngRoute%250A%2520%2520%2520%2520at%2520Error%2520(%253Canonymous%253E)%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A6%253A453%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A20%253A119%250A%2520%2520%2520%2520at%2520a%2520(http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A19%253A353)%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A20%253A14%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A28%253A434%250A%2520%2520%2520%2520at%2520Array.forEach%2520(native)%250A%2520%2520%2520%2520at%2520q%2520(http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A7%253A261)%250A%2520%2520%2520%2520at%2520e%2520(http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A28%253A374)%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9876%252Fabsolute%252FUsers%252Fanna%252FDropbox%252Fprojects%252Fastellas-riskfactorcalc-app%252Fapp%252Fbower_components%252Fangular%252Fangular.min.js%253F1383935561000%253A28%253A451%0A%20%20%20%20at%20Error%20(%3Canonymous%3E)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fabsolute%2FUsers%2Fanna%2FDropbox%2Fprojects%2Fastellas-riskfactorcalc-app%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F1383935561000%3A6%3A453%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fabsolute%2FUsers%2Fanna%2FDropbox%2Fprojects%2Fastellas-riskfactorcalc-app%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F1383935561000%3A29%3A262%0A%20%20%20%20at%20Array.forEach%20(native)%0A%20%20%20%20at%20q%20(http%3A%2F%2Flocalhost%3A9876%2Fabsolute%2FUsers%2Fanna%2FDropbox%2Fprojects%2Fastellas-riskfactorcalc-app%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F1383935561000%3A7%3A261)%0A%20%20%20%20at%20e%20(http%3A%2F%2Flocalhost%3A9876%2Fabsolute%2FUsers%2Fanna%2FDropbox%2Fprojects%2Fastellas-riskfactorcalc-app%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F1383935561000%3A28%3A374)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9876%2Fabsolute%2FUsers%2Fanna%2FDropbox%2Fprojects%2Fastellas-riskfactorcalc-app%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F1383935561000%3A28%3A451%0A%20%20%20%20at%20Array.forEach%20(native)%0A%20%20%20%20at%20q%20(http%3A%2F%2Flocalhost%3A9876%2Fabsolute%2FUsers%2Fanna%2FDropbox%2Fprojects%2Fastellas-riskfactorcalc-app%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F1383935561000%3A7%3A261)%0A%20%20%20%20at%20e%20(http%3A%2F%2Flocalhost%3A9876%2Fabsolute%2FUsers%2Fanna%2FDropbox%2Fprojects%2Fastellas-riskfactorcalc-app%2Fapp%2Fbower_components%2Fangular%2Fangular.min.js%3F1383935561000%3A28%3A374)
at Error (<anonymous>)
at /Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js:6:453
at /Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js:29:262
at Array.forEach (native)
at q (/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js:7:261)
at e (/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js:28:374)
at Object.Xb [as injector] (/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js:32:427)
at workFn (/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/test/angular-mocks.js:2114:52)
Here is the URL decoded stack trace:
Error: [$injector:modulerr] http://errors.angularjs.org/undefined/$injector/modulerr?p0=astellasRiskfactorcalcAppApp&p1=Error: [$injector:modulerr] http://errors.angularjs.org/undefined/$injector/modulerr?p0=ngRoute&p1=Error: [$injector:nomod] http://errors.angularjs.org/undefined/$injector/nomod?p0=ngRoute
at Error (<anonymous>)
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:6:453
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:20:119
at a (http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:19:353)
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:20:14
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:28:434
at Array.forEach (native)
at q (http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:7:261)
at e (http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:28:374)
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:28:451
at Error (<anonymous>)
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:6:453
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:29:262
at Array.forEach (native)
at q (http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:7:261)
at e (http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:28:374)
at http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:28:451
at Array.forEach (native)
at q (http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:7:261)
at e (http://localhost:9876/absolute/Users/anna/Dropbox/projects/astellas-riskfactorcalc-app/app/bower_components/angular/angular.min.js?1383935561000:28:374)
It mentions ngRoute in line 1. The documentation says:
In AngularJS 1.2.0 and later, ngRoute has been moved to its own module. If you are getting this error after upgrading to 1.2.x, be sure that you've installed ngRoute.
If you are using Angular 1.2.x, have you tried adding ngRoute as a dependency of myApp?
I am having a hard time figuring out why http.post method is not being called within my tests, which is indicated by the message saying ~ "nothing to flush" as well as adding console.log statements to both the success and the error promise methods.
The api code does work when using the app. This is my first angular controller test so I could be missing something simple.
I have been using David Mosher's example as a template https://github.com/davemo/lineman-angular-template/blob/master/spec/controllers/login_controller_spec.coffee
# controller
"use strict"
angular.module("woddlyApp").controller "SignupCtrl", ($scope, $http, $location) ->
$scope.user = {}
$scope.save = (user, role) ->
user.role = role
$http.post('/users', user)
.success (data, status, headers, config) ->
$location.path '/dashboard'
.error (data, status, headers, config) ->
# tests
'use strict'
describe 'Controller: SignupCtrl', ->
# load the controller's module
beforeEach -> module('woddlyApp')
# Initialize the controller and a mock scope
beforeEach inject ($controller, $rootScope, #$location, #$httpBackend) ->
#scope = $rootScope.$new()
#redirect = spyOn($location, 'path')
$controller 'SignupCtrl', { $scope: #scope, $location: $location }
afterEach ->
#$httpBackend.verifyNoOutstandingRequest()
#$httpBackend.verifyNoOutstandingExpectation()
describe 'Successful signup', ->
beforeEach ->
#$httpBackend.expectPOST('/users', #scope.user).respond(200)
#scope.save(#scope.user, 'member')
#$httpBackend.flush()
it 'redirects the user to the dashboard page', ->
expect(#redirect).toHaveBeenCalledWith '/dashboard'
Error
Chrome 28.0 (Linux) Controller: SignupCtrl Successful signup redirects the user to the dashboard page FAILED
Error: No pending request to flush !
at Error (<anonymous>)
at Function.$httpBackend.flush (/home/chris/projects/personal/woddly/client/app/components/angular-mocks/angular-mocks.js:1195:34)
at null.<anonymous> (/home/chris/projects/personal/woddly/client/.tmp/spec/controllers/signup.js:25:34)
Expected spy path to have been called with [ '/dashboard' ] but it was never called.
Error: Expected spy path to have been called with [ '/dashboard' ] but it was never called.
at null.<anonymous> (/home/chris/projects/personal/woddly/client/.tmp/spec/controllers/signup.js:30:38)
Error: Unsatisfied requests: POST /users
at Error (<anonymous>)
at Function.$httpBackend.verifyNoOutstandingExpectation (/home/chris/projects/personal/woddly/client/app/components/angular-mocks/angular-mocks.js:1228:13)
at null.<anonymous> (/home/chris/projects/personal/woddly/client/.tmp/spec/controllers/signup.js:19:32)
As mentioned in the comments I am using angular 1.1.5 (for the new ng-animate). To get my tests passing I needed to install the angular-mocks 1.1.5.
bower install angular-mocks-unstable
or update the bower.js (or components.js) file and run:
bower install
And update my karma.conf.js file
files = [
JASMINE,
JASMINE_ADAPTER,
'app/components/angular-unstable/angular.js',
'app/components/angular-mocks-unstable/angular-mocks.js', // need unstable here
'.tmp/scripts/*.js',
'.tmp/scripts/**/*.js',
'.tmp/spec/**/*.js'
];