angular 使用 jasmine 测试路由时为空 $state 名称

Question

像许多人一样，我是 Angular 测试 Jasmine 的新手，并且正在努力做到这一点。我使用 ui-router 进行路由，现在，我遇到的问题是测试中的 $state.current.name 是一个空字符串，并且我不知道为什么会这样。

这是我的路由模块中的代码：

var cacRouteViewMod = angular.module('cacRouteViewMod', ['ui.router', 'cacLib']);

cacRouteViewMod.config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) {

  $stateProvider
  .state('countries', {
    url: '/countries',
    templateUrl: 'countries/countries.html',
    controller: 'countriesCtrl',
    resolve : {
      countries: ["getCountry", function(getCountry) {
        return getCountry();
      }]
    }
  });

}]);

我写的测试是这样的：

describe('cac_app_views (routing)', function() {

  var $rootScope,
      $state,
      $injector,
      getCountryMock,
      state = 'countries';

  beforeEach(function() {

    module('cacRouteViewMod', function($provide, $urlRouterProvider) {
      $urlRouterProvider.deferIntercept();
      $provide.value('getCountry', getCountryMock = {});
    });

    inject(function(_$rootScope_, _$state_, _$injector_, $templateCache) {
      $rootScope = _$rootScope_;
      $state     = _$state_;
      $injector  = _$injector_;
      $templateCache.put('countries/countries.html', '');
    })
  });

  // Test 1
  it('should respond to URL', function() {
    expect($state.href(state)).toEqual('#/countries');
  });

  // Test 2
  it('should resolve getCountry', function() {
    getCountryMock = jasmine.createSpy('getCountry').and.returnValue('nanana');

    $rootScope.$apply(function() {
      $state.go('countries');
    });

    expect($state.current.name).toBe('countries');
    expect($injector.invoke($state.current.resolve.countries)).toBe('nanana');
  });
});

测试 1 没问题，但问题是测试 2。测试失败，因为它期望 '' 为 'countries'.

当我将 $state.current 登录到控制台时，它显示

Object {name: "", url: "^", views: null, abstract: true}

此时我感到非常绝望。谁能帮我 understand/solve 这个问题？

Answer 1

按照documentation$state.goreturns的承诺。

您应该使用 Jasmine 中的 done() 函数来测试这样的代码：http://ng-learn.org/2014/08/Testing_Promises_with_Jasmine/

Answer 2

我是这样解决的：

通过阅读类似的 stockoverflow 帖子，我为 $stateChangeError 设置了一个侦听器，它被触发了。我注销了 error 数据，发现它是一个 typeError: getCountry is not a function。这导致 $state 没有更新，因此仍然包含原始（空）$state.

我将 $provide.value 修改为：

$provide.value('getCountry', getCountryMock = function() {return 'nanana';});

表示“每当调用 getCountry 时，提供 getCountryMock，这是一个 returns 字符串 'nanana'.

的函数

现在所有测试都按照我希望的方式进行。

注意：我发现 getCountryMock = jasmine.createSpy..... 行代码在我对 $provide.value() 的其他更改中已过时，因此我将其注释掉。

angular 使用 jasmine 测试路由时为空 $state 名称

angular empty $state name when testing routing with jasmine

javascript

unit-testing

angularjs

angular-ui-router

karma-jasmine