使用 Angularjs 和 requirejs 时在测试中注入答案

【问题标题】：Injection in test when using Angularjs & requirejs使用 Angularjs 和 requirejs 时在测试中注入
【发布时间】：2012-12-21 14:31:05
【问题描述】：

我目前正在尝试将 AngularJS 与 RequireJS 一起使用，但我不知道如何使测试与注入一起工作。如果没有 RequireJS，我们可以，

实施

PhoneListCtrl.$inject = ['$scope', '$http'];  
var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { 
    /* constructor body */ 
}];

测试

beforeEach(inject(function(_$httpBackend_, $rootScope, $controller) {
  $httpBackend = _$httpBackend_;
  $httpBackend.expectGET('phones/phones.json').
      respond([{name: 'Nexus S'}, {name: 'Motorola DROID'}]);
  scope = $rootScope.$new();
  ctrl = $controller(PhoneListCtrl, {$scope: scope});
}));

但是，当我们使用 RequireJS 时，我们可以将控制器定义如下，

demoController.js

define(["dependency"], function() {
    /* constructor body */ 
});

当使用这个控制器时，我们将它添加为依赖项之一，并且没有变量声明。（让我以“控制器”为例，因为我们最好称它为“服务”）

一些JS.js

define(["demoController"], function(controller) {
     controller.method();
});

我的问题
在使用 RequireJS(AMD) 时，我们如何将 $http、$scope（或其他）注入目标控制器或服务进行测试？

任何帮助将不胜感激。

【问题讨论】：

标签： testing mocking angularjs requirejs inject

【解决方案1】：

我做过类似的事情：

/*global define, document */

define(['angular', 'jquery'], function (angular, $) {
    'use strict';

    return function () {
        var $injector = angular.bootstrap(document, ['myApp']);
        var $controller = $injector.get('$controller');
        var myController = $controller('myController');
    };
});

这个想法是 angular.bootstrap 返回一个注入器，它允许您获取服务。

【讨论】：

感谢您的回答，但我仍然不知道如何实现它。我的意思是我想注入 $httpBackend 进行测试，在这种情况下如何使用您的示例？
嗯，我自己用小提琴试了一下，没能解决。实际上，我不会费心使用 requirejs 进行单元/e2e 测试。不过考虑使用testacular

【解决方案2】：

我终于通过以下方式让它工作了。

angular.module('app').controller('MyController', ['$scope', 'dep2', function              ($scope, dep2) {
    $scope.method = function () {//do something};
}]);

我们可以在这样的测试用例中使用这个控制器：

inject(function($controller, $rootScope, dep2) {
        scope = $rootScope.$new();
        myController = $controller("MyController",
                {
                    $scope : scope,
                    dep2: dep2
                });
);

【讨论】：