如何testingAngularJS指令

我正在使用AngularJS的Rails 3.2应用程序。 我可以让Angular做我所需要的,但是我很难搞清楚如何testing我在做什么。 我正在使用guard-jasmine来运行使用PhantomJS的Jasmine规格。

这里是(相关的)html:

<html id="ng-app" ng-app="app"> <div id="directive-element" class="directive-element"> </div> </html> 

JavaScript(在coffeescript中)看起来像:

 window.Project = App: angular.module('app', []) Directive: {} Project.Directive.DirectiveElement = -> restrict: 'C' link: (scope, element, attrs) -> element.html 'hello world' Project.App.directive 'directiveElement', Project.Directive.DirectiveElement 

上面的代码完全是它打算做的。 testing是问题。 我根本无法让他们工作。 这是我曾经试过的一件事。 发布这个主要是为了开始谈话的地方。

 describe 'App.Directive.DirectiveElement', -> it 'updates directive-element', -> inject ($compile, $rootScope) -> element = $compile('<div id="app" ng-app="app"><div id="directive'element" class="directive-element"></div></div>') expect(element.text()).toEqual('hello world') 

顺便说一句,我是AngularJS的新手,所以如果有关于命名空间,模块等的最佳实践,我不会遵循,那么我将不胜感激。

我如何得到这个testing工作?

以下是如何在angular-ui / bootstrap中testing警报指令 。

这是另一个简单的testing,对于button指令。

这里有一些提示:

  • 一定要告诉testing运行者使用beforeEach(module('myModule'))testing哪个模块。

  • 如果你的指令中有外部的templateUrls,你需要以某种方式预先caching它们给testing运行器。 testing运行器不能asynchronousGET模板。 在bootstrap中,我们将构build步骤中的模板注入到javascript中,并将每个模板作为模块。 我们使用grunt-html2js grunt任务。

  • 在你的testing中,使用beforeEachinject助手来注入$ compile和$ rootScope以及其他你需要的服务。 使用var myScope = $rootScope.$new()为每个testing创build一个新的范围。 你可以做var myElement = $compile('<my-directive></my-directive>')(myScope); 创build您的指令的实例,并有权访问其元素。

  • 如果一个指令创build了自己的作用域,并且你想对它进行testing,你可以通过var directiveScope = myElement.children().scope()来访问该指令的作用域var directiveScope = myElement.children().scope() – 获取元素的子级(指令本身),并得到这个范围。

  • 为了testing超时,可以使用$timeout.flush()来结束所有等待的超时。

  • 为了testing承诺,记住,当你解决一个承诺,它不会调用它的callback,直到下一个摘要。 所以在testing中你必须做很多事情: deferred.resolve(); scope.$apply(); deferred.resolve(); scope.$apply();

你可以在bootstrap回购中find各种复杂指令的testing。 只要看看src/{directiveName}/test/

Angular Test Patterns可以帮助你,在coffeescript和javascript中都有例子。

下面是一个testing模式来validation示例指令是否呈现预期的输出 。