luigiinred
luigiinred

Reputation: 31

AngularJS: inject causing error in tests

I am unable to use inject in my tests.

Both angular and angular-mocks are version 1.3.14

I am completely lost here. Any ideas will be greatly appreciated!

This causes an error:

describe("factory: Account", function () {

    var $httpBackend;
    var $rootScope;
    var Account;

    beforeEach(module('app'));

    beforeEach(inject(function() {
        // $httpBackend = _$httpBackend_;
    }));


    it("Should fetch account", function() {
    });
});

But if I remove inject it will pass:

describe("factory: Account", function () {

    var $httpBackend;
    var $rootScope;
    var Account;

    beforeEach(module('app'));

    beforeEach(function() {
        // $httpBackend = _$httpBackend_;
    });


    it("Should fetch account", function() {
    });
});

In Gruntfile.js:

    karma: {
        unit: {
            options: {
                frameworks: ['jasmine'],
                singleRun: true,
                browsers: ['Safari'],
                files: [
                    'bower_components/angular/angular.js',
                    'bower_components/angular-mocks/angular-mocks.js',
                    'bower_components/moment/moment.js',
                    'bower_components/ckeditor/ckeditor.js',
                    'bower_components/ng-ckeditor/ng-ckeditor.min.js',
                    'app/app.js',
                    'app/**/*.js',
                ]
            }
        }
    }

Here is the output of the test:

Safari 8.0.5 (Mac OS X 10.10.3) factory: Account Should fetch account FAILED
    /.../bower_components/angular/angular.js:63:32
    /.../bower_components/angular/angular.js:4120:30
    forEach@/.../bower_components/angular/angular.js:323:24
    loadModules@/.../bower_components/angular/angular.js:4081:12
    createInjector@/.../bower_components/angular/angular.js:4007:22
    workFn@/.../bower_components/angular-mocks/angular-mocks.js:2353:60

Upvotes: 3

Views: 2089

Answers (4)

ahuddles
ahuddles

Reputation: 41

I was experiencing the same problem. It was also a dependency issue, like @user2755599, and this post https://stackoverflow.com/a/37946833/2908670 helped me out.

Basically, error messages might be hidden by PhantomJS. Switch to a browser like Chrome for running the tests to get more information.

Upvotes: 2

user2755599
user2755599

Reputation: 1

For me the issue was simply due to loading angular-mocks twice.

The project was written using Browserify and the original developers included mocks in the vendor.js bundle as well as loading it into Karma via it's config. Once I removed mocks from the bundle and only let Karma load it I was good to go.

Upvotes: 0

Omri Aharon
Omri Aharon

Reputation: 17064

It worked if you removed the inject because basically then it doesn't do anything.

You need the inject, and the $httpBackend should be passed as a parameter wrapped in underscores:

describe("factory: Account", function () {

    var $httpBackend;
    var $rootScope;
    var Account;

    beforeEach(module('app'));

    beforeEach(inject(function(_$httpBackend_) {
        $httpBackend = _$httpBackend_;
    }));


    it("Should fetch account", function() {
    });
});

Upvotes: 0

leo_tintin
leo_tintin

Reputation: 11

I think you should write it like this:

describe("factory: Account", function () {
    var $httpBackend;
    var $rootScope;
    var Account;

    beforeEach(module('app'));

    beforeEach(function(_$httpBackend_) {
         $httpBackend = _$httpBackend_;
    });

    it("Should fetch account", function() {
    });
});

You need to declare $httpBackend before using it.

Upvotes: 1

Related Questions