toa*_*amb 44 testing angularjs angularjs-directive
我正在使用将使用AngularJS的Rails 3.2应用程序.我可以让Angular做我需要的东西,但是我很难搞清楚如何测试我正在做的事情.我正在使用guard-jasmine来使用PhantomJS运行Jasmine规范.
这是(相关)html:
<html id="ng-app" ng-app="app">
<div id="directive-element" class="directive-element">
</div>
</html>
Run Code Online (Sandbox Code Playgroud)
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
Run Code Online (Sandbox Code Playgroud)
上面的代码完全符合它的目的.测试是问题所在.我根本无法让他们工作.这是我尝试过的一件事.发布这个主要是为了在某个地方开始对话.
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')
Run Code Online (Sandbox Code Playgroud)
顺便说一下,我是AngularJS的新手,所以如果有关于我没有遵循的命名空间,模块等的最佳实践,我们将非常感谢指导.
我如何进行测试才能使用?
And*_*lin 68
以下是在angular-ui/bootstrap中测试alert指令的方法.
以下是一些提示:
务必告诉测试运行器您正在测试哪个模块beforeEach(module('myModule')).
如果您的指令中有外部templateUrls,您将需要以某种方式为测试运行器预先缓存它们.测试运行器不能异步GET模板.在bootstrap中,我们通过构建步骤将模板注入到javascript中,并使每个模板成为一个模块.我们使用grunt-html2jsgrunt任务.
在您的测试中,使用a中的inject帮助程序beforeEach来注入$ compile和$ rootScope以及您需要的任何其他服务.使用var myScope = $rootScope.$new()创建为每个测试一个新的范围.您可以var myElement = $compile('<my-directive></my-directive>')(myScope);创建指令的实例,并可以访问其元素.
如果指令创建了自己的作用域并且您想要对其进行测试,则可以通过执行来获取该指令的作用域var directiveScope = myElement.children().scope()- 它将获取元素的子作用(指令本身),并获得该作用域的作用域.
要测试超时,您可以使用$timeout.flush()结束所有挂起的超时.
为了测试promise,请记住,当你解决一个promise时,它不会then在下一个摘要之前调用它的回调.所以在测试中你必须做很多事情:deferred.resolve(); scope.$apply();.
您可以在bootstrap repo中找到不同复杂度的指令测试.只是看看src/{directiveName}/test/.
| 归档时间: |
|
| 查看次数: |
25140 次 |
| 最近记录: |