41

ここhttp://docs.angularjs.org/tutorial/step_07にあるように、

angular.module('phonecat', []).
  config(['$routeProvider', function($routeProvider) {
  $routeProvider.
      when('/phones', {templateUrl: 'partials/phone-list.html',   controller: PhoneListCtrl}).
      when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}).
      otherwise({redirectTo: '/phones'});
}]);

ルーティング テストは e2e テストで行うことをお勧めします。

  it('should redirect index.html to index.html#/phones', function() {
    browser().navigateTo('../../app/index.html');
    expect(browser().location().url()).toBe('/phones');
  });

ただし、「$routeProvider」構成は単一の関数 function($routeProvider) で行われると思います。ルーティング機能はブラウザー DOM を必要としないため、ブラウザーを使用せずに単体テストを実行できるはずです。

たとえば、
url が /foo の場合、templateUrl は /partials/foo.html である必要があり、コントローラーは FooCtrl である
必要があり、URL が /bar である場合、templateUrl は /partials/bar.html である必要があり、コントローラーは BarCtrl である必要があります。

これは単純な関数 IMO であり、単純なテスト、単体テストでもテストする必要があります。

この $routeProvider 単体テストをグーグルで検索しましたが、まだ運がありません。

https://github.com/angular/angular.js/blob/master/test/ng/routeSpec.js . _

4

3 に答える 3

45

次のように $routeProvider をテストできるはずです。

angular.module('phonecat', []).
  config(['$routeProvider', function($routeProvider) {
  $routeProvider.
      when('/phones', {templateUrl: 'partials/phone-list.html',   controller: PhoneListCtrl}).
      when('/phones/:phoneId', {templateUrl: 'partials/phone-detail.html', controller: PhoneDetailCtrl}).
      otherwise({redirectTo: '/phones'});
}]);


it('should test routeProvider', function() {
  module('phonecat');

  inject(function($route, $location, $rootScope) {

    expect($route.current).toBeUndefined();
    $location.path('/phones/1');
    $rootScope.$digest();

    expect($route.current.templateUrl).toBe('partials/phone-detail.html');
    expect($route.current.controller).toBe(PhoneDetailCtrl);

    $location.path('/otherwise');
    $rootScope.$digest();

    expect($location.path()).toBe('/phones/');
    expect($route.current.templateUrl).toEqual('partials/phone-list.html');
    expect($route.current.controller).toBe(PhoneListCtrl);

  });
});
于 2013-04-13T22:27:36.887 に答える
5

前の 2 つの回答を組み合わせて、ルーターをブラック ボックスとしてテストしたい場合は、ルートが何であれ、必要な場所 (コントローラー自体ではなく) に正常にルーティングされていることを確認します。

// assuming the usual inject beforeEach for $route etc.
var expected = {};
it('should call the right controller for /phones route', function () { 
    expected.controller = $route.routes['/phones'].controller;
    $location.path('/phones');
    $rootScope.$digest();
    expect($route.current.controller).toBe(expected.controller);
});

it('should redirect to redirectUrl from any other route', function () {
    expected.path = $route.routes[null].redirectTo;
    $location.path('/wherever-wrong');
    $rootScope.$digest();
    expect($location.path()).toBe(expected.path);
});
于 2015-08-22T09:02:22.673 に答える