1

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

  1. 我不能使用whenGET('').passThrough()，因为我没有使用ngMockE2E。
  2. 我不需要使用ngMockE2E，因为我正在为一个指令编写单元测试，该指令实际上除了吐出“bar”之外什么都不做。
  3. 一个建议是使用代理服务器来提供这些 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使用 templateUrl 将这些废话拉出来并阻止 AngularJS 应用程序配置块在我的指令单元测试中运行？

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

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

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

但我认为这不一定相关。

4

1 回答 1

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
于 2014-02-11T02:32:56.730 回答