angularjs에서 특정 컨트롤러의 스코프를 얻으십시오

Question

QUnit 프레임 워크를 통해 내 angularjs 앱을 테스트 해 봅니다.
mysite.ru/#/unittest/ 페이지에서 UnittestCtrl이라는 컨트롤러를 사용합니다. 하지만 내 응용 프로그램에서 나는 DetailCtrl 및 테스트하려는 다른 페이지가 있습니다. 문제는 unittest 페이지에서 DetailCtrl의 범위에 액세스 할 수 없다는 것입니다.

Unittest 컨트롤러의 범위를 mysite.ru/#/unittest/에 가져 오기 위해 사용하는 코드입니다. DetailCtrl에서 범위에 액세스하려면 어떻게해야합니까?

var appElement = document.querySelector('[ng-app=TheApp]'); 
var appScope = angular.element(appElement).scope(); 
var controllerScope = appScope.$$childHead; 
console.log(controllerScope.link); 

나는이 시도하지만 어떤 결과가 없습니다 :

오류

var serviceLocator = angular.injector(["TheApp"]) 
scope = serviceLocator.get('$rootScope') 
var $controller = serviceLocator.get('$controller'); 
$controller('DetailCtrl', { 
       $scope: scope 
      }); 

: Unknown provider: $rootElementProvider <- $rootElement <- $location <- $route

내 DetailCtrl

Controllers.controller('DetailCtrl', ['$scope', '$routeParams', '$http', '$route', 
function($scope, $routeParams, $http, $route) { 
    $scope.reloadRoute = function() { 
    window.location.reload(); 
    }; 
    $scope.cityId = $routeParams.cityId; 
... 

Answer 1

angular.injector가 인젝터를 만들어이 (ng 모듈이되지 않습니다 짐을 실은).

angular.bootstrap을 호출하여 인젝터 (ng 모듈이로드 됨)를 만들고이를 일부 DOM 요소에 연결합니다. 그것은 $rootElement 서비스를 생성합니다.

이 테스트에서 angular.bootstrap 기능을 일치 시키려면, $rootElement는 조롱한다 :

angular.injector([ 
    'ng', 
    ($provide) => { 
    $provide.value('$rootElement', angular.element('<div>')) 
    }, 
    'app' 
]); 

더 좋은 방법이 훨씬 더 수행 angular-mock을 사용합니다.

angular.injector(['ngMock', 'app']); 

은 자동으로 재스민과 모카로드 ngMock에 자신을 결합하지만 QUnit에 대한 옵션이 아닙니다.

하지만 여기에 주소가 있어야하는 실제 문제는 라우터입니다. 유닛 테스트에서 유닛은 다른 유닛과 격리되어야하며 다른 유닛 ($route 및 $routeParams 서비스)은 조롱되어야합니다. 인젝터 또는 $controller에서 수행 할 수 있으므로 인젝터의 종속성을 무시할 수 있습니다.

var mockedRoute = { ... }. 
var mockedRouteParams = { ... }; 

$controller('DetailCtrl', { 
    $scope: scope, 
    $route: mockedRoute, 
    $routeParams: mockedRouteParams 
});