javascript - 如何使用 templateUrl 阻止 AngularJS 应用程序配置 block 在我的指令单元测试中运行？

Question

我见过类似的问题，但没有一个能解决问题的根源，假设如下:

1. 我无法使用 whenGET('').passThrough()，因为我没有使用 ngMockE2E .
2. 我不需要使用 ngMockE2E因为我正在为一个指令编写单元测试，该指令实际上除了吐出“bar”之外什么也不做。
3. 一项建议是use a proxy server提供这些 HTTP 响应，但这是否违背了单元测试的目的？

现在，让我向您展示我的指令:

angular.module('app')
  .directive('foo', function () {
    return {
      restrict: 'A',
      templateUrl: 'templates/bar.html'
    };
  });

这是单元测试:

describe('Directive: foo', function () {

  // load the directive's module
  beforeEach(module('app'));

  var $compile;
  var $rootScope;
  var $httpBackend;

  beforeEach(inject(function(_$compile_, _$rootScope_, $injector) {
    $compile = _$compile_;
    $rootScope = _$rootScope_;
    $httpBackend = $injector.get('$httpBackend');
  }));

  afterEach(function() {
    $httpBackend.verifyNoOutstandingExpectation();
    $httpBackend.verifyNoOutstandingRequest();
  });

  it('should be bar', inject(function($templateCache) {
    $templateCache.put('templates/bar.html', 'bar');
    var element = $compile('<div data-foo></div>')($rootScope);

    //$httpBackend.whenGET(/^\/translations\//).passThrough(); // doesn't work
    $httpBackend.expectGET(/\/translations\//).respond('201', ''); // works
    $rootScope.$digest();
    $httpBackend.flush();

    expect(element.text()).toBe('bar'); // works
  }));
});

现在，测试可以很好地处理所有这些虚假的 $httpBackend 业务，但这完全不属于我的单元测试!如何将这个 $httpBackend 废话拉出来并阻止 AngularJS 应用程序配置 block 在带有 templateUrl 的指令单元测试中运行？

注意:只有当指令中有 templateUrl 时才会发生这种情况。

顺便说一句，在应用程序配置 block 中触发此 HTTP 请求的代码是:

$translatePartialLoaderProvider.addPart('index');
$translateProvider.useLoader('$translatePartialLoader', {
  urlTemplate: '/translations/{part}/{lang}.json'
});

但我认为这不一定相关。

Answer 1

将您的指令放入其自己的模块中，并将该模块包含到您的主应用程序模块中。然后您可以在不加载应用程序模块的情况下测试您的指令模块。

例如

angular.module('app-directives', [])
  .directive('foo', function () {
    return {
      restrict: 'A',
      templateUrl: 'templates/bar.html'
    };
  });

angular.module('app', ['app-directives'])
  //Run your config stuff here