微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

如何在我的AngularJS指令测试中模拟点击事件?

我试过遵循 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

原文地址:https://www.jb51.cc/angularjs/146266.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐