angularjs路由单元测试
正如我们在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函数,它也应该在一个简单的测试中进行测试,一个单元测试。
我google搜索这个$ routeProvider单元测试,但没有运气。
我想我可以从这里借用一些代码,但还没有完成,https://github.com/angular/angular.js/blob/master/test/ng/routeSpec.js。
为什么不只是断言路由对象配置正确?
it('should map routes to controllers', function() {
module('phonecat');
inject(function($route) {
expect($route.routes['/phones'].controller).toBe('PhoneListCtrl');
expect($route.routes['/phones'].templateUrl).
toEqual('partials/phone-list.html');
expect($route.routes['/phones/:phoneId'].templateUrl).
toEqual('partials/phone-detail.html');
expect($route.routes['/phones/:phoneId'].controller).
toEqual('PhoneDetailCtrl');
// otherwise redirect to
expect($route.routes[null].redirectTo).toEqual('/phones')
});
});
我认为你应该能够像这样测试$ 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);
});
});
结合前面的两个答案,如果你想测试路由器作为一个黑盒子,它应该成功路由(不是控制器自己配置),无论路由如何:
// 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);
});
链接地址: http://www.djcxy.com/p/77619.html