如何在Javascript中合成按键答案

【问题标题】：How to synthesize key presses in Javascript如何在Javascript中合成按键
【发布时间】：2013-02-24 13:35:36
【问题描述】：

我想为文本框中的一些输入过滤代码编写一些测试。对于大多数测试，我只需调用setValue 并触发更改事件，这很容易做到。但是，在这种情况下，因为我想测试输入是否被过滤掉（或不被过滤掉），所以我不能直接 setValue()。

我尝试调度 keydown、keyup、keypress、textinput 事件。 I can see that the handlers for them are being called, but the text doesn't actually show in the text box 请注意，这只在 Firefox 中“有效”，我知道代码在其他浏览器中看起来会有所不同。

function dispatch(target, eventType, charCode) {
   var evt = document.createEvent("KeyboardEvent");
   evt.initKeyEvent(
     eventType,
     true,
     true,
     window,
     false,
     false,
     false,
     false,
     charCode,
     0
   );
   target.dispatchEvent(evt);
}


var id = document.getElementById('id');
id.onkeydown = id.onkeyup = id.onkeypress = function() {console.log(arguments)}

dispatch(id, 'keydown', 65);
dispatch(id, 'keyup', 65);
dispatch(id, 'keypress', 65);
dispatch(id, 'textinput', 65);
// I can see the handlers were called but it doesn't display in the text box

我知道这有一些限制，因为我们不希望网络应用只是假装它们是在为用户行事。但是，这是为了测试我自己的应用程序，我可以使用特定的配置文件启动 Firefox 并安装插件，或者如果我知道它会有所帮助，甚至可以自己编写。

我追求的是避免使用 Selenium，我想让 Java 排除在我的 JS 测试之外，因为它不仅速度慢，而且我必须在 Java 中重新实现很多 DOM 查询。

毕竟，问题是，有人知道如何让该代码实际修改输入吗？调整设置，安装插件？

未回答我的问题的问题列表

【问题讨论】：

那么是什么阻止您在 firefox 中编写 NPAPI 扩展以允许触发本机键盘事件？确实，这不是最简单的事情，但是有相当多的关于构建插件的文档（并且将其链接到 javascript 函数的部分相对容易）。我无法帮助细节，因为我在这方面的经验很少，但整个事情绝对是可能的。
@DavidMulder 没有什么能阻止我，它需要我为我想测试的所有平台编写一个不同的插件，所以这是负面的。如果这是唯一的方法，我可能会这样做。感觉这是可能的，但我正在寻找可靠的确认，这将是可能的。也许已经有插件了？
你用的是哪个版本的FF？自 FF 12 以来，编辑器（例如文本框）拒绝不受信任的关键事件。这是一个 bugzilla 链接：bugzilla.mozilla.org/show_bug.cgi?id=749185
@Satyajit 我不想留在旧版本的 FF 上让它工作，我更喜欢插件
@JuanMendes：我对 Java 堆栈有同样的厌恶:) 所以我试图在纯 JS 中构建一个类似 selenium 的实现（使用 node/express 模拟 selenium 服务器）。目前我只针对 chrome，如果有兴趣可以在这里查看项目：github.com/djfm/browsercontrol。目前还没有太多文档，但测试非常全面（只需运行 mocha 即可查看）。不幸的是，我现在遇到了同样的事件触发问题。

标签： javascript dom-events keypress

【解决方案1】：

我刚刚发现以下代码至少可以在 Chrome 中运行。不要进入firefox或IE http://jsfiddle.net/D2s5T/14/

function dispatch(target, eventType, char) {
   var evt = document.createEvent("TextEvent");    
   evt.initTextEvent (eventType, true, true, window, char, 0, "en-US");
   target.focus();
   target.dispatchEvent(evt);
}
dispatch(el, "textInput", "a");

【讨论】：