unit-testing - 将模拟 DOM 事件传递给没有 jQuery 的指令处理程序

标签 unit-testing angularjs mocking jasmine karma-runner

我有一个非常简单的指令,其目的只是取消 dragstart事件:

link: function(scope, element) {
  element.on('dragstart', function(e) {
    e.preventDefault();
  })
}

我如何在 Jasmine 测试中测试这个?我有以下测试试图监视 Event 对象,并将其传递给处理程序:
var mockEvent; 

beforeEach(function() {
  mockEvent = new Event('dragstart');
  spyOn(mockEvent,'preventDefault');
});

it('should call preventDefault', function () {
  element.triggerHandler('dragstart', mockEvent);
  expect(mockEvent.preventDefault).toHaveBeenCalled();
});

但是测试失败。您可以 see this at this Plunker. .我如何测试这个(/重构指令以使其可测试)?

编辑:理想情况下不包括 jQuery。
编辑:更改标签

最佳答案

您可以包含 jquery 并创建一个 jquery 事件对象。这个对象可以很容易地传递:

beforeEach(function() {
  mockEvent = $.Event('dragstart');
  spyOn(mockEvent,'preventDefault');
});

it('should call preventDefault', function () {
  element.triggerHandler(mockEvent);
  expect(mockEvent.preventDefault).toHaveBeenCalled();
});

我在你的 plunkr 中使用了这个 jquery 版本://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js

关于unit-testing - 将模拟 DOM 事件传递给没有 jQuery 的指令处理程序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20967037/

相关文章:

unit-testing - 游戏框架 : Internationalisation within Akka and Unit-Test

angularjs - Bower 安装卡在 json 输出 : "message": "Answer",

angularjs - 当状态发生变化时,如何防止重新加载命名 View ? AngularJS UI-路由器

node.js - Jest 模拟子模块功能

用于 ACCESS_MOCK_LOCATIONS 的 Android Studio 调试特定的 AndroidManifest.xml

unit-testing - 包含单元测试的测试是否应该按特定顺序运行?

unit-testing - 如何使用 jasmine 和 browserify 进行单元测试?

node.js - 为什么 sinon 不取代实际的函数调用?

angularjs - 如何在 angularjs 中显示 summernote 编辑器数据的预览,包括图像和格式?

testing - 使用 testify mock 进行表驱动测试