Testing Angular with Jasmine/Node: Uncaught type error "Cannot set property of 'mock' undefined

Question

I am trying to create the Jasmine unit tests described in "Angular.js in Action". The app runs properly but I keep getting this error in the node.js command prompt when trying to run my test.

My config:

module.exports = function(config) {
config.set({

// base path, that will be used to resolve files and exclude
basePath: '',


// frameworks to use
frameworks: ['jasmine'],


// list of files / patterns to load in the browser
files: [

  'javascripts/angular.min.js',
  'javascripts/angular-mocks.js',
  'javascripts/app.js',
  'tests/angelloModelSpec.js',
  ],

My index.html header:

<head>
    <script src="javascripts/angular.min.js" type="text/javascript"></script>
    <script src="javascripts/angular-mocks.js"></script>
    <script src="javascripts/app.js"></script>


    <meta charset="utf-8">
    <title>Angello</title>
    <meta name="description" content="Angello Story Application">
    <link rel="stylesheet" href="app.css">
</head>

My test:

describe('Service: angelloModel', function(){

// load the service's module
beforeEach(module('Angello'));

var modelService;

// Initialize the service
beforeEach(inject(function (angelloModel){
    modelService = angelloModel;
}));

describe('#getStatuses', function(){
    it('should return seven different statuses', function () {
        expect(modelService.getStatuses().length).toBe(7);
    });
});
});

output in command prompt:

Your environment has been set up for using Node.js 0.10.26 (x64) and npm.

Your environment has been set up for using Node.js 0.10.26 (x64) and npm.

C:\Users\jmclaughlin>karma start karma.conf.js
INFO [karma]: Karma v0.10.9 server started at http://localhost:****/
INFO [launcher]: Starting browser Chrome
INFO [Chrome 33.0.1750 (Windows 7)]: Connected on socket ***************
Chrome 33.0.1750 (Windows 7) ERROR
    Uncaught TypeError: Cannot set property 'mock' of undefined
    at C:/Angello/javascripts/angular-mocks.js:17
Chrome 33.0.1750 (Windows 7): Executed 0 of 0 ERROR (0.465 secs / 0 secs)

When using version 1.0.7 of each file:

Your environment has been set up for using Node.js 0.10.26 (x64) and npm.

C:\Users\myUsername>karma start karma.conf.js
INFO [karma]: Karma v0.10.9 server started at http://localhost:****/
INFO [launcher]: Starting browser Chrome
INFO [Chrome 33.0.1750 (Windows 7)]: Connected on socket ***************
Chrome 33.0.1750 (Windows 7) ERROR
    Uncaught ReferenceError: angular is not defined
    at C:/Angello/javascripts/angular-mocks.js:16
Chrome 33.0.1750 (Windows 7): Executed 0 of 0 ERROR (0.064 secs / 0 secs)

perhaps the version of angular is very different from the version of angular mocks? they likely depend on each other? what version of each are you using? — Maslow
– Maslow, Commented Mar 4, 2014 at 20:09
AngularJS v1.0.7 and the mocks file comes from: AngularJS v1.2.9 — Jamie M.
– Jamie M., Commented Mar 4, 2014 at 20:12
Changed the mocks version to 1.0.7 and got a different error: "angular is not defined" — Jamie M.
– Jamie M., Commented Mar 4, 2014 at 20:19
this occurs to me and for me the error was using bower and npm at the same time.... — Juan
– Juan, Commented Mar 4, 2016 at 15:08

ailveen · Accepted Answer · 2014-03-04 20:30:22Z

14

Normally this is caused by conflicting versions of angular, a wrong order of scripts definition in karma.conf.js, an incomplete import, or a syntax error.

Since I can see that you are testing a service, include that services' js file under the files (unless it is embedded in app.js) and remove the misplaced comma (see below):

files: [

'javascripts/angular.min.js',
'javascripts/angular-mocks.js',
'javascripts/app.js',
'<include your service js here>',
'tests/angelloModelSpec.js', <<-- and remove this trailing comma
],

answered Mar 4, 2014 at 20:30

ailveen

5833 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Jamie M. Over a year ago

The service is embedded in app.js. I removed the errant comma..thanks.

ailveen Over a year ago

angular.min.js should define window.angular = {}, and angular mocks should be able to see it. The order is correct, but somehow it does not work. Check the chrome console/karma console because it might not have loaded angular.min.js properly. best of luck

Jamie M. Over a year ago

added an answer above...I was editing the wrong config file....for some reason,I had one open in the app directory and the one Jasmine was looking for was in C:\Users\myUsername\karma.conf.js

Jamie M. · Accepted Answer · 2014-03-04 21:09:05Z

2

I found the problem! i was editing the wrong config file! I was editing a config file inside the app directory but the real config file was in C:\Users\myUsername\karma.conf.js

Thank you for your help!

answered Mar 4, 2014 at 21:09

Jamie M.

7321 gold badge9 silver badges17 bronze badges

2 Comments

Ian G Over a year ago

This unfortunately does not explain to the reader why you got the error in the first place.

Jamie M. Over a year ago

Angular was not defined in the correct config file.

kenechukwu igweagu · Accepted Answer · 2021-03-15 02:53:47Z

0

You have to have the angular.min.js file above the angular-mocks.min.js file above your own app.js files in that order.

files: [
  'https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js',
  'https://cdnjs.cloudflare.com/ajax/libs/angular-mocks/1.8.2/angular-mocks.min.js',
  'https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js',
  'js/app.js',
  ...
],

answered Mar 15, 2021 at 2:53

kenechukwu igweagu

112 bronze badges

Collectives™ on Stack Overflow

Testing Angular with Jasmine/Node: Uncaught type error "Cannot set property of 'mock' undefined

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related