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' 설정은 단일 함수인 함수($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.
루트 오브젝트가 올바르게 설정되어 있는지 확인하는 것만으로 끝납니다.
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);
});
});
위의 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);
});
언급URL : https://stackoverflow.com/questions/15990102/angularjs-route-unit-testing
'programing' 카테고리의 다른 글
앵글의 새 페이지로 리다이렉트$location을 사용하는 JS (0) | 2023.03.31 |
---|---|
AngularJS - 서버측 검증 및 클라이언트측 폼 (0) | 2023.03.31 |
angular-ui 버전 0.11.0에서 Datepicker가 두 번 열리지 않음 (0) | 2023.03.31 |
'any' vs 'Object' (0) | 2023.03.26 |
프로젝터로 약속을 만들고 조작하는 방법 (0) | 2023.03.26 |