我试过遵循
ng-directive-testing repo的格式我写的指令。该指令基本上在用户点击元素时呈现覆盖。这里是指令(简化):
mod.directive('uiCopyLinkDialog',function(){ return { restrict: 'A',link: function(scope,element,attrs) { var $elm = angular.element(element); element.bind('click',function(event) { $elm.addClass('test'); }); } }; });
我写的测试看起来像这样:
describe('pre-compiled link',function () { beforeEach(mocks.inject(function($compile,$rootScope) { scope = $rootScope; element = angular.element('<span class="foo" ui-copy-link-dialog="url"></span>'); $compile(element)(scope); scope.$digest(); })); it("should change the class when clicked",function () { element.click(); // this returns "'undefined' is not a function" element[0].click(); // so does this $(elm).click(); // this uses jquery and doesn't *seem* to fail waits(500); // hack to see if it was a race condition expect(elm.className).toContain('test'); // always fails }); });
你可以在测试中看到,我尝试了几种方法来触发链接上的click()事件,其中大多数都给出了未定义的错误。
任何人都可以告诉我我在这里做错了什么?阅读示例这听起来是正确的语法,但我的测试跑者(通过Grunt的Karma)不想玩球。
您可以使用triggerHandler,JQLite的一部分。
我使用它来触发指令上的点击事件…
element = angular.element("<div myDirective-on='click'></div>"); compiled = $compile(element)($rootScope); compiled.triggerHandler('click');
本博文上提供的完整示例:
http://sravi-kiran.blogspot.co.nz/2013/12/TriggeringEventsInAngularJsDirectiveTests.html