23

My angular app worked great and so did my tests, using karma and jasmine, until I added a dependency in ui.bootstrap. Now the app still works as expected, but I can't get my tests to run. This is what I have:

app.js - added dependency in ui.bootstrap

angular.module('myApp', ['ngResource', 'ngRoute', 'ui.bootstrap']).config(function(...) {...});

service.js

angular.module('myApp').service('myService', function () {})

controller.js

angular.module('myApp').controller('MyController', function ($scope, $http, myService) {})

tests/main.js

describe('Controller: MyController', function () {
    var MyController, scope;
    // load the controller's module
    beforeEach(function(){
        module('myApp');
        inject(function ($controller, $rootScope) {
            scope = $rootScope.$new();
            MyController = $controller('MyController', {
                $scope:scope
            });
        });
    });
    it('should do something', function () {
        expect(scope.myOptions.length).toBe(5);
    });
});

And my test, which I run using grunt and krama, fails due to:

Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:modulerr] Failed to instantiate module ui.bootstrap due to:
Error: [$injector:nomod] Module 'ui.bootstrap' is not available! You either misspelled the module name or forgot

What have I missed? The app runs with no problem, only the test fails.

Chen-Tsu Lin
  • 22,876
  • 16
  • 53
  • 63
Haji
  • 1,715
  • 7
  • 25
  • 41
  • 24
    please check your karam.conf.js file that the bootstrap-ui js files are included. – michael Feb 10 '14 at 14:58
  • Yeah, that was it. Missed the karma.conf.js there. Thanks! – Haji Feb 10 '14 at 21:21
  • 1
    I have the same issue just now, but I was wondering why I should load all of the modules if it's a unit test and should isolate that specific piece of code? Unless I misunderstand it feels like you have to load everything which would be more of an integration test? – Stokedout Dec 18 '14 at 11:16

3 Answers3

36

In karma.conf.js there is a list of files that karma loads before test execution:

// list of files / patterns to load in the browser
files: [
  'bower_components/angular/angular.js',
  'bower_components/angular-mocks/angular-mocks.js',
  ...
]

Add bootstrap-ui.js there.

Bastian Voigt
  • 5,311
  • 6
  • 47
  • 65
  • 1
    The question still showed up as unanswered cause it was only answered in comments. So I added it again as a "real answer" – Bastian Voigt Sep 10 '14 at 12:19
  • 4
    Question: Don't you have to do something like this? `module('myApp', ['ngResource', 'ngRoute', 'ui.bootstrap'])` in the test to reference and instanciate the module? – Alejandro Garcia Anglada Sep 11 '15 at 10:03
2

Inject your dependencies

beforeEach(function(){
   angular.module('ui.bootstrap',[]);
});
ndurgaprasad
  • 31
  • 3
1

I had the same problem. Just solved it. Somehow putting the module(myApp); function call inside a the function you provide to beforeEach() doesn't work just try this:

Extract the module call into its own beforeEach():

beforeEach(module('myApp'));

And use another beforeEach() for the function you use.

gavvel
  • 51
  • 6