AngularJS $resource 服务模拟，正确的方法答案

【问题标题】：AngularJS $resource service mocking, the right wayAngularJS $resource 服务模拟，正确的方法
【发布时间】：2016-12-31 13:10:36
【问题描述】：

我对 AngularJS $resource 服务应该被模拟以进行测试的方式感到困惑。我找到了两种使用 $httpBackend 服务的方法。一种方法（取自 Pluralsight 教程）：

describe('test', function() {

    beforeEach(module('name'));

    it('text', inject(function($httpBackend) {
        $httpBackend.expectGET("/url");
        // some code
        $httpBackend.flush();
    });
}

另一种方式（复制自this SO answer）：

describe('test', function () {
    var $httpBackend;
    beforeEach(angular.mock.module('name'));

    beforeEach(function () {
        angular.mock.inject(function ($injector) {
            $httpBackend = $injector.get('$httpBackend');
        })
    });

    describe('text', function () {
        it('text', inject(function (User) {
            $httpBackend.expectGET('/url')
                .respond([{
                    property: 'test'
                }]);

            // Some code

            $httpBackend.flush();
        }));

    });
});

我不明白为什么第一种方式直接使用module，而第二种方式使用angular.mock.module。然后注入 httpBackend 服务的方式就不同了。第二种方式要冗长得多。如果第一种方法有效，那么第二种方法的冗长又有什么意义呢？

【问题讨论】：

module 是angular.mock.module 的快捷方式。后者可用于避免与 CommonJS 模块发生冲突。如果应该在多个规范中使用相同的服务，则使用 beforeEach。
谢谢。但是对于 beforeEach，我理解，但我不明白为什么在第一种情况下使用 inject(function($httpBackend) 就足够了，而在第二种情况下， angular.mock.inject(function ($injector) 被使用。

标签： angularjs unit-testing mocking

【解决方案1】：

没有正确的方法，这里有几个不同的问题需要牢记。

module 是angular.mock.module 的快捷方式。后者可用于避免与 CommonJS 模块冲突。

使用angular.mock.inject 的唯一原因是与angular.mock.module 保持一致，它始终可以安全地缩短为inject。

beforeEach(inject(...)) 用于如果应该在多个规范中使用相同的服务。

beforeEach(function () { inject(...) }) 是beforeEach(inject(...)) 的详细版本。如果在 beforeEach 块中应该有除 inject 之外的其他内容，请考虑将其拆分为多个 beforeEach 块以提高可读性。

$injector.get 只是冗长，在样式或功能方面没有任何好处。如果服务是变量，它没有任何好处，但它提供了一种有用的模式，可以将服务批量分配给 this 规范上下文，而无需多次枚举它们：

beforeEach(inject(function ($injector) {
  var self = this;

  ['$httpBackend', ...].forEach(function (depName) {
    self[depName] = $injector.get(depName);
  });
}));

it(function () {
  var self = this;

  self.$httpBackend...
});

【讨论】：