anglejsの特定のコントローラからスコープを取得

Question

私は、anglejsアプリケーションをQUnitフレームワークでテストしようとしています。
ページ上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モジュールがロードされている）を作成するためにangular.injectorを呼び出し、それをいくつかの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 
});