unit-testing - 如何模拟指令以启用更高级别指令的单元测试？

Question

在我们的应用程序中，我们有多层嵌套指令。我正在尝试为顶级指令编写一些单元测试。我已经 mock 了指令本身需要的东西，但现在我遇到了来自较低级别指令的错误。在我对顶级指令的单元测试中，我不想担心较低级别指令中发生的情况。我只是想模拟较低级别的指令，并且基本上让它什么都不做，这样我就可以单独测试顶级指令。

我尝试通过执行以下操作来覆盖指令定义:

angular.module("myModule").directive("myLowerLevelDirective", function() {
    return {
        link: function(scope, element, attrs) {
            //do nothing
        }
    }
});

但是，这不会覆盖它，它只是在实际指令之外运行它。如何阻止这些较低级别的指令在我的顶级指令的单元测试中执行任何操作？

Answer 1

指令只是工厂，因此最好的方法是使用 module 函数模拟指令的工厂，通常在 beforeEach block 中。假设您有一个名为 do-something 的指令，由一个名为 do-something-else 的指令使用，您可以这样模拟它:

beforeEach(module('yourapp/test', function($provide){
  $provide.factory('doSomethingDirective', function(){ return {}; });
}));

// Or using the shorthand sytax
beforeEach(module('yourapp/test', { doSomethingDirective: {} ));

然后，当在测试中编译模板时，该指令将被覆盖

inject(function($compile, $rootScope){
  $compile('<do-something-else></do-something-else>', $rootScope.$new());
});

请注意，您需要在名称中添加“Directive”后缀，因为编译器会在内部执行此操作:https://github.com/angular/angular.js/blob/821ed310a75719765448e8b15e3a56f0389107a5/src/ng/compile.js#L530