AngularJS, route resolve, location change, unit tests, karma-jasmine

Question

In angular i've written a route resolve on all actions, to check wether you are logged in or not

$routeProvider.when('/home', {
    resolve: {
        Authenticated: function($location, AuthAuthenticator, AuthIdentity) {
            return new Promise(function(resolve, reject) {
                AuthAuthenticator.init().then(
                    function( success ) {
                        if (!AuthAuthenticator.isAuthenticated() ) {
                            $location.path("/login");
                            resolve( true );
                        }
                        resolve( false );
                    },
                    function( error ) {
                        reject( error );
                    }
                );
            });
        }
    }
});

If you are not logged in we redirect you towards the login page. Now i want to test this in our karma-jasmine unit test. But if i write the test, location.path doesn't change.

describe('LoginController', function() {
    beforeEach(module('dcApp'));

    beforeEach(function() {
        var _authenticated = false;

        AuthAuthenticatorMock = {
            isAuthenticated: function() {
                return _authenticated
            },

            setAuthenticated: function( authenticated ) {
                _authenticated = authenticated;
            },
        };

        module( function( $provide ) {
            $provide.value('AuthAuthenticator', AuthAuthenticatorMock);
        });
    });

    var $controller;

    beforeEach(inject(function( _$route_, _$location_, _$controller_, _AuthAuthenticator_ ){
        // The injector unwraps the underscores (_) from around the parameter names when matching
        $route = _$route_;
        $location = _$location_;
        $controller = _$controller_;
        AuthAuthenticator = _AuthAuthenticator_;
    }));

    describe('Controller activation', function() {
        it ('redirects to login if user is not yet logged in', function() {
            AuthAuthenticator.setAuthenticated( false );
            var $scope = {};
            var controller = $controller('HomeController', { $scope: $scope });
            expect( $location.path() ).toBe('/login');
        });
    });

});

But the result is:

PhantomJS 2.1.1 (Linux 0.0.0) HomeController Controller activation redirects to login if user is not yet logged in FAILED
Expected '' to be '/login'.

Now i've seen some documentation on spy, but i don't get how to check for this location change.

Answer 1

You can test this properly by invoking the resolve yourself after the before eaches have taken place.

describe('LoginController', function() {
    beforeEach(module('dcApp'));

    beforeEach(function() {
        var _authenticated = false;

        AuthAuthenticatorMock = {
            isAuthenticated: function() {
                return _authenticated
            },

            setAuthenticated: function( authenticated ) {
                _authenticated = authenticated;
            },
        };

        module( function( $provide ) {
            $provide.value('AuthAuthenticator', AuthAuthenticatorMock);
        });
    });

    beforeEach( function() {
        var _path = '';

        locationMock = {
            path: function( argument ) {
                if (argument) {
                    _path = argument;
                }
                return _path;
            }
        };

        module( function( $provide ) {
            $provide.value('$location', locationMock );
        });
    });

    var $controller;

    beforeEach(inject(function( _$route_, _$location_, _$controller_, _AuthAuthenticator_ ){
        // The injector unwraps the underscores (_) from around the parameter names when matching
        $route = _$route_;
        $location = _$location_;
        $controller = _$controller_;
        AuthAuthenticator = _AuthAuthenticator_;
    }));

    describe('Controller activation', function() {
        it ('redirects to login if user is not yet logged in', function() {
            AuthAuthenticator.setAuthenticated( false );
            var resolveTest = $route.routes['/home'].resolve.Authenticated;
            $injector.invoke( resolveTest );
        // if it's a promise call apply
            $rootScope.$apply();
            expect( $location.path() ).toBe('/login');
        });
    });

});