title: Unit Testing UI Router With Resolve
body: <p>I am trying to write a unit test for my <code>ui-router</code> with uses <code>resolve</code>.</p>
  
  <p>Router.js</p>
  
  <pre><code>define(['module', 'require'], function(module, require) {
      'use strict';
  
      var Router = function ($stateProvider, $urlRouterProvider) {
  
          $urlRouterProvider.otherwise('/shopping');
  
          $stateProvider
              .state('shopping', {
                  url: '/shopping',
                  templateUrl: 'app/shopping.html',
                  resolve:{
                      userFactory : 'UserFactory',
                      checkAccess:function(userFactory){
                          return userFactory.checkUser();
                      }
                  }
              })
              .state('products', {
                  url: '/products',
                  templateUrl: 'app/products.html',
                  resolve:{
                      userFactory : 'UserFactory',
                      checkAccess:function(userFactory){
                          return userFactory.checkUser();
                      }
                  }
              })
              .state('notAuth', {
                  url: '/notAuth',
                  templateUrl: 'app/unauthorised.html'
              });
      };
  
      module.exports = ['$stateProvider', '$urlRouterProvider', Router];
  });
  </code></pre>
  
  <p>Within userFactory.checkUser(); i essentially check the users' rights, and redirect either to the templateUrl, or perform a:</p>
  
  <pre><code>$state.go('notAuth');
  </code></pre>
  
  <p>My currect .spec.js:</p>
  
  <pre><code>define(['require', 'angular-mocks', 'angular-ui-router', 'app/router'], function (require) {
      'use strict';
      describe('myApp/myState', function() {
  
          var $rootScope, $state, $injector, myServiceMock, $httpBackend, state = 'shopping';
  
          var mockResponse = {
              "access": true
          }
  
          var angular = require('angular');
          var myRouter = require('app/router');
  
          beforeEach(module('ui.router'));
  
          beforeEach(function() {
  
              module(myRouter, function($provide) {
                  $provide.value('userFactory', myServiceMock = {});
              });
  
              inject(function(_$rootScope_, _$state_, _$injector_, $templateCache, _$httpBackend_) {
                  $rootScope = _$rootScope_.$new();
                  $state = _$state_;
                  $injector = _$injector_;
                  $httpBackend = _$httpBackend_;
                  $rootScope.$digest();
              })
          });
  
          it('should transition to shopping', inject(function($state,$rootScope){
              $state.transitionTo('shopping');
              $rootScope.$apply();
              expect($state.current.name).toBe('shopping');
          }));
  
          it('should resolve data', function() {
              myServiceMock.checkUser = jasmine.createSpy('checkUser').and.returnValue(mockResponse);
              // earlier than jasmine 2.0, replace "and.returnValue" with "andReturn"
  
              $state.go(state);
              $rootScope.$digest();
              expect($state.current.name).toBe(state);
          });
      });
  });
  </code></pre>
  
  <p>With the above test, i get the following errors:</p>
  
  <pre><code>Information:  myApp/myState
  Information:    should transition to shopping   Error: [$rootScope:infdig] 10 $digest() iterations reached. Aborting!
  Information:    Watchers fired in the last 5 iterations: []
  Information:    http://errors.angularjs.org/1.4.0/$rootScope/infdig?p0=10&amp;p1=%5B%5D
  
  Information:    should resolve data Expected '' to be 'shopping'.
  </code></pre>