角度测试指令存根子指令

【问题标题】：angular testing directive stub child directive角度测试指令存根子指令
【发布时间】：2015-04-14 10:44:07
【问题描述】：

我想测试一个其标记包含子指令的指令。例如

<div class="directiveUnderTest">
  <child-directive></child-directive>
</div>

我想在我的单元测试中删除子指令，这样它就不会尝试“编译”它，而是忽略这个指令。我可以的

inject(function($templateCache) {
            $templateCache.put('/path/to/child/directive', '');
});

但这现在取决于子指令的实现。我想删除整个子指令。

我不想覆盖被测指令的模板，因为我需要编译真正的模板才能创建预期的范围。

有什么建议吗？

提前致谢。

【问题讨论】：

标签： angularjs unit-testing directive

【解决方案1】：

因为指令只是一个工厂，所以您可以使用$provide 在测试中模拟它们。然后，当您构建“假”指令时，您可以为其提供templateUrl，它仍然会加载您需要的内容。下面的示例显示了一种确保伪指令保持在隔离范围内并提供所需内容的方法。

beforeEach(function () {
    module('moduleName', function ($provide) {
        $provide.factory('nameOfDirective', function () {
            return { templateUrl: 'path/to/template' };
        }
    });
});

需要注意的是，您实际上需要在指令名称后加上 Directive 后缀，普通编译器会在声明 .directive('name', ...) 时自动执行此操作，以使 Angular 知道它是什么类型的工厂。

【讨论】：