测试更高级别的 javascript 事件答案

【问题标题】：Testing higherlevel javascript events测试更高级别的 javascript 事件
【发布时间】：2011-07-26 02:37:51
【问题描述】：

我正在寻找一个 javascript 测试库，该库可用于规范测试用户交互，例如拖放、悬停、双击/单击和在画布上绘图。我查看了几个库，包括 jspec 和 jasmine，但两者似乎都更基于单元测试。

如果我忽略了上述任何一个库都支持此类测试的事实，我会喜欢一个示例。

编辑

所以我昨晚看了很多，真的什么都没发现。如果可能的话，我希望在更高级别上模拟用户交互，而不是像 jasmine 这样的水豚风格，因为它只是假装与 dom 的交互。

我想要一个真正模拟鼠标按下 -> 鼠标移动 -> 鼠标向上事件链的库。

这样的神奇创造存在吗？

发布赏金编辑

所以，我继续尝试使用 JS 测试库，并且对它们在使用 html5 画布时的运行方式非常不满意。似乎使用画布无法在 jasmine 中测试事件，因为 jasmine 不会初始化画布。

我不喜欢您必须使用“html”固定装置而不是实际测试应用程序代码。如果您尝试将 js 集成到您的应用程序中，这似乎是倒退的。对于规范测试，它是有意义的，但 Web 框架的 BDD 测试将要求它实际使用应用程序视图进行测试。

又是这样的怪物存在还是我的头在云端？

【问题讨论】：

你试过 Selenium 或 Watr 吗？
我使用过 Selenium，但我不知道有一个很好的 js 硒库我只是习惯了 Web 驱动程序来推动其他测试框架向前发展。 Watr 我只是尝试谷歌并没有得到任何链接，所以链接会很好。泰
对不起，我拼错了。 watir.com
这两个仍然遭受同样的跌倒，我无法测试像在画布上画一条线这样的东西......
我不知道有任何 js 库旨在通过一个不错的 API 模拟用户交互。您必须通过 DOM 事件或 jQuery 手动执行此操作。

标签： javascript integration-testing

【解决方案1】：

你试过PhantomJS或ZombieJS吗？我特别听说过 Phantom 的好消息。

=============

另一个建议：Selenium 插件/宏。 www.seleniumwiki.com/selenium-rc/selenium-mousedownat-mousemoveat-and-mouseupat-example/ 或 glauche.de/2009/09/09/drag-drop-with-selenium/ 。

【讨论】：

【解决方案2】：

我已经看到了解决这个问题的唯一好方法：DOH Robot。它运行 java 小程序，允许发出实际的 javascript 事件并模拟真实的用户行为（包括拖放测试）。

DOH 不依赖于 dojo，因此您可以在任何项目中使用它。不幸的是，它并没有被广泛使用，尽管它确实是一个很酷的测试框架。

【讨论】：

【解决方案3】：

在 JavaScript 中模拟用户行为需要您创建自定义 Event Objects，在 Element 上调度它们，并修改它们的属性，其中最重要的属性在标准中只读兼容的浏览器。

在 IE 5+ 中，它们似乎是可修改的，但这显然不包括跨浏览器测试。

http://msdn.microsoft.com/en-us/library/ms535863(v=vs.85).aspx

~~所以，我认为你的想法是不可能的。~~

编辑：考虑一下（并查看 Selenium Firefox 扩展的文档），显然您可以编写一个 JavaScript 程序，根据给定schedule 将以编程方式创建模拟用户行为的自定义Event Objects。

但是，我不确定这是否是 Selenium 所做的，或者——更重要的是——这是否是一种可靠的方法。 Aso 它本质上意味着您已排除的"faking interaction with the DOM"。

顺便说一句，让我正确理解这一点：所以您本质上需要一个 JavaScript 库来测试应用程序的 JavaScript 部分；但是，您还希望它在浏览器级别（而不是在 DOM 引擎级别）上工作，即模拟真正的用户交互，就好像它被浏览器捕获一样？

【讨论】：

您不能修改事件对象的属性。当您第一次初始化事件本身时，您应该使用属性的值来初始化它们。例如e=document.createEvent("UIEvent");e.initMouseEvent(...)。此外，事件适用于任何 Node 或 AbstractView（例如文档、窗口），而不仅仅是 Elements。
@Eli Grey：这就是我要说的。你不修改它们。但是，在尝试 OP 想要做的事情时，您必须这样做。你的第二个似乎有点不精确：你不能在其他任何东西上注册 Event，然后是 Element（或者 - 除了例外 - AbstractView），也不能发送它。
那么像 capybera 和 selinum 这样的东西是如何向浏览器注册鼠标事件的呢？
好吧，我现在意识到我在用错了措辞，我一直在看水豚。与浏览器和 rspec/cucumber 交互的测试框架。唯一的问题是它现在不支持 mousedown 仅拖放
对我来说听起来已经足够好了。您总是可以使用 DOM 方法单独测试 mousedown 部分。

【解决方案4】：

我刚刚使用 jasmine 和 jQuery 成功测试了需要鼠标事件的代码。

http://api.jquery.com/category/events/event-object/

只需像这样创建和触发事件：

  // Create a new jQuery.Event object with specified event properties.
  var e = jQuery.Event("keydown", { keyCode: 64 });

  // trigger an artificial keydown event with keyCode 64
  jQuery("body").trigger( e );

然后使用 Jasmine 检查属性。顺便说一句，如果你需要检查动画，你可以像这样模拟时间：

//http://groups.google.com/group/jasmine-js/browse_thread/thread/dbdc5ad1c1514322

beforeEach(function() { 
  jasmine.Clock.useMock(); 
}); 
//... call the code that calls setTimeout 
jasmine.Clock.tick(500); // advance 500 msec

【讨论】：

【解决方案5】：

去看看 jQuery 和 Dojo。或者你可以去 jsfiddle 网站看看。他们有一组库，您无需下载库即可在线测试。

【讨论】：