Angular控制器未在茉莉花测试中初始化

Question

I ran into issues writing jasmine tests for an AngularJS application using angular ui-router. My services and app get initialized properly in the test, but the controllers do not start up properly. I've taken the application in question out of the equation and reduced the problem to a simple one controller example that exhibits the same behavior. Here's the actual test code:

describe('Test', function() {
    var async = new AsyncSpec(this);
    var scope = {};

    beforeEach(angular.mock.module('TestApp'));

    beforeEach(angular.mock.inject(function($rootScope, $state, $templateCache) {
        scope.$rootScope  = $rootScope;
        scope.$state      = $state;

        $templateCache.put('start.html', '<div class="start"></div>');
    }));

    async.it('Test that TestCtrl is initialized', function(done) {
        scope.$rootScope.status = { done: false };
        scope.$rootScope.$on('$stateChangeSuccess', function(event, state, params) {
            expect(scope.$rootScope.status.done).toBe(true);
            done();
        });
        scope.$state.transitionTo('start', {}, { notify: true });
        scope.$rootScope.$apply();
    });
});

Here's the complete runnable test

The application gets initialized correctly, the ui router is able to transition the application to the correct state, but the controller does not get initialized. I need the router to initialize the controllers as the router passes critical configuration to them. I want to avoid duplicating that configuration in the tests.

I must be missing something, but what? I appreciate any and all input, thanks!

Answer 1

You need to use the $controller service to instantiate your controller in your tests and pass it your scope. For example...

ctrl = $controller('TestCtrl', {$scope: scope});

Notice that I also moved the declaration of $rootScope.done to the TestCtrl to prevent an error about $rootScope.done being undefined. Here's the fiddle...

http://jsfiddle.net/C8QtB/3/