我正在使用Behat和Mink与Selenium2驱动程序,我正在尝试直接键入表单字段(模拟原始键盘输入),而不是使用该fillField()函数.
这就是我正在尝试的:
$element = $this->getSession()->getPage()->find('css', '#questionName');
$element->focus();
$element->keyPress('a');
// also tried this, with no success
// $element->keyDown('a');
// $element->keyUp('a');
Run Code Online (Sandbox Code Playgroud)
<input type="text" id="questionName">页面上有一个元素.它正确接收焦点,但不响应任何模拟键盘输入.
是否可以像这样模拟原始键盘输入?
我究竟做错了什么?
尽管有很多关于如何在JS中模拟按键(keydown/keypress)的文章,但没有一个解决方案似乎与我正在使用的浏览器一起使用(Firefox ESR 17.0.7,Chrome 28.0.1500.72,IE 10).我测试的解决方案来自这里,这里和这里.
我要做的是模拟textarea/input中的任何键击.虽然我可以追加/删除直接更改"值"的字符,但我看不到选项,只能输入"Up","Down","Home"等键的模拟.
根据文档,它应该很简单.例如:
var e = document.createEvent("KeyboardEvent");
if (e.initKeyboardEvent) { // Chrome, IE
e.initKeyboardEvent("keydown", true, true, document.defaultView, "Enter", 0, "", false, "");
} else { // FF
e.initKeyEvent("keydown", true, true, document.defaultView, false, false, false, false, 13, 0);
}
document.getElementById("text").dispatchEvent(e);
Run Code Online (Sandbox Code Playgroud)
确实触发了"Enter"keydown事件,我的处理程序可以捕获它.但是,它不会以任何方式影响textarea - 不会出现新行.其他键码相同:不显示字符,箭头不改变插入符号的位置等.
我已经通过Orwellophile扩展了代码并将其发布到http://jsfiddle.net/npF3d/4/,所以任何人都可以使用代码.在我的浏览器中,在任何情况下都没有按钮对textarea产生任何影响.
我将不胜感激这个问题的任何帮助.
我正在为Facebook编写Chrome扩展程序,并希望以编程方式触发在帖子上提交重点评论草稿.默认行为是在用户点击Enter键时提交,因此我试图诱骗Facebook UI认为用户这样做了.
Facebook使用React和contenteditablediv作为评论表单.
这是我尝试过的一系列事情:
1)jQuery事件触发 $('<the contenteditable div>').trigger($.Event('keydown', {which: 13}))
postMessage和Chrome控制台)document从每个上下文触发事件.2)同样的事情,但VanillaJS事件触发.相关的StackOverflow问题
3)此时我意识到这是React并且它使用它自己的SyntheticEvents,所以我基本上复制/粘贴了该Simulate函数,ReactTestUtils它应该通过模拟事件帮助测试并在页面环境中运行(required通过Facebook的前端抓取对象的引用)require功能).
我已经尝试了大多数keydown事件,因为它拥有最多的听众.
我知道这些问题,但它们没有帮助我理解:强制React通过注入JavaScript来触发事件
我试图通过javascript在网页中模拟键盘事件,因为Safari浏览器不支持Actions.
首先,我创建了一个简单的表单(如下所示),并试图通过文本框进行选项卡,但它不起作用.
使用的Java脚本:( ubuntu和chrome浏览器).我在Chrome浏览器控制台中解雇了该脚本.
var pressTabKey = document.createEvent("KeyboardEvent");
pressTabKey.initKeyboardEvent("keypress", true, true, null, false, false, false, false, 9, 0);
document.getElementById('1234').focus();
document.getElementById('1234').dispatchEvent(pressTabKey);
Run Code Online (Sandbox Code Playgroud)
HTML表格:
<html>
<head>
</head>
<body>
<p>Test Page </p>
<form>
<input id="1234" type="text" value="Enter Here">
<br>
<br>
<input id="1235" type="text" value="Enter Here">
</form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud) 我想在文本框中为一些输入过滤代码编写一些测试.对于大多数测试,我可以调用setValue并触发更改事件,这很容易做到.但是,在这种情况下,因为我想测试输入被过滤掉(或不过滤),我不能setValue()直接.
我尝试调度keydown,keyup,keypress,textinput事件.我可以看到它们的处理程序被调用,但文本实际上没有显示在文本框中注意,这只在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
Run Code Online (Sandbox Code Playgroud)
我知道这有限制,因为我们不希望网络应用程序只是假装他们正在为用户行事.但是,这是为了测试我自己的应用程序,我可以使用特定的配置文件启动firefox并安装插件,如果我知道它会有所帮助,甚至可以自己编写.
我所追求的是避免使用Selenium,我想让Java远离我的JS测试,因为它不仅速度慢,而且还必须重新实现Java中的大量DOM查询.
毕竟,问题是,是否有人知道如何让代码实际修改输入?调整设置,安装插件?
没有回答我的问题的问题列表
我想使用Javascript控制台模拟Keypress事件.我使用输入元素看到了很多答案.我不想使用输入元素.我只想将一些代码粘贴到Javascript控制台中并模拟一个按键事件(特别是后空格按钮).
欢迎使用jQuery的答案.
请注意这个问题.我看到除了触发tab按键事件之外还有其他方法,但我仍然想知道为什么触发tab键按下事件不会将焦点移动到下一个输入字段.
HTML
<textarea></textarea>
<textarea></textarea>
<textarea></textarea>
Run Code Online (Sandbox Code Playgroud)
JS
$('textarea').on('keydown', function(e) {
if (e.metaKey && e.which === 40) {
console.log('test');
$(this).trigger({
type: 'keypress',
which: 9
});
}
});
Run Code Online (Sandbox Code Playgroud) 一点上下文:我正在开发一个基于HTML5的移动应用程序,该应用程序具有自动完成功能,由于setSelectionRange中的错误而在Android上中断:http://code.google.com/p/android/issues/detail? id = 15245因此,我不能像通常那样直接操作文本字段中的文本.为了解决这个问题,我计划手动触发几个关键事件来模拟用户按下android软键盘上的键.
我找到的所有解决方案是否可以通过编程方式模拟按键事件?并且在JavaScript中触发键盘事件只是触发事件而不实际创建任何文本输入.
有没有办法模拟整个按键事件,包括文本输入,使用JavaScript?
更新:修复(有点)
我通过使用Trigger(我们正在使用的包装器)编写一个插件来手动触发本机级别的Android键盘事件来解决这个问题.它在这里举办:http://bit.ly/RiJqrM,如果有其他人感兴趣的话.
另一个更新:
进一步的挫折和随后的测试让我走了一圈,事实证明上面提到的android bug可能有点像红鲱鱼.我的插入符号表现奇怪的原因实际上可能是由于本机android自动完成的一些组合以及jQuery focus()在android(无耻的自我推销)上根本不起作用的事实:Android JQuery focus()变通方法
我正在创建一个扩展,我必须在contenteditable div上模拟一个空格键,用户在Google Plus中键入消息(状态).
如果您打开plus.google.com并点击必须输入消息的div,您会发现当您在消息中键入链接并按{spacebar}时,您会发现Google会检索标题,图片和描述那个链接.我是3天试图模拟空格键盘.我已经可以模拟鼠标悬停在表单的元素上,我可以在发送按钮中模拟click(),但我仍然无法模拟空格键keydown.
到目前为止,我最好的代码是:
var e = new KeyboardEvent("keydown", {bubbles : true, cancelable : true, key : " ", char : " ", shiftKey : false, keyCode: 32, which: 32, view: window});
//I need to delete the e.keyCode and e.which cause Chrome sets it as a readonly but for some reason if you delete it and assign a new value Chrome accepts (I am very sure this is a serious bug that I discovered in Chrome and that I …Run Code Online (Sandbox Code Playgroud) 我有以下表单字段,工作正常.通过这种方式,我的意思是当我在字段中键入,粘贴等时fooObj.expDate,实时更新得很好并且验证发生.我有预标签,这对我自己来说很明显.
<pre>{{fooObj.someDate | json}}</pre>
<div class="form-group inline-form__input">
<label for="someDate">Some Date</label>
<input tabindex="2"
type="tel"
class="form-control"
maxlength="7"
placeholder="MM/YY"
formControlName="someDate"
name="someDate"
[(ngModel)]="fooObj.someDate"
someDate>
</div>
Run Code Online (Sandbox Code Playgroud)
但是,我someDate在这个领域有这个指令.该指令拦截粘贴事件.它取消了粘贴事件,对输入进行了一些奇特的格式化,然后执行此操作:
setTimeout(() => {
this.target.value = 'lol fancy date';
}, 3000);
Run Code Online (Sandbox Code Playgroud)
target.value是我的someDate领域.值在输入框内得到了很好的更新(我看到它在输入内的屏幕上发生了变化).但是,fooObj.someDate未更新并且不会进行验证.例如,在超时中设置目标值不会触发与键入/粘贴/任何其他javascript事件相同的验证/对象更新.
Angular docs对此没什么用处:
只有当应用程序响应异步事件(例如击键)时,Angular才会更新绑定(以及屏幕).此示例代码将keyup事件绑定到数字0,可能是最短的模板语句.虽然该语句没有任何用处,但它满足Angular的要求,因此Angular将更新屏幕.
那么,如何从该字段的指令触发字段更新?
编辑:我尝试使用我元素中的代码触发注释中建议的元素上的事件:如何手动触发onchange事件?
运行正常,但不强制该字段更新:
if ("createEvent" in document) {
var evt = document.createEvent("HTMLEvents");
evt.initEvent("change", false, true);
this.target.dispatchEvent(evt);
}
else
this.target.fireEvent("onchange");
Run Code Online (Sandbox Code Playgroud)
此外,这里是我得到合成事件的想法,不会触发"正常"的行为作为一个keyDown或任何会(我真的希望我误读或他们错误的这个用例,但它不适用于尝试重新发布粘贴事件):https://www.w3.org/TR/clipboard-apis/#clipboard-event-interfaces
注意:合成事件没有默认操作.换句话说,虽然上面的脚本将触发粘贴事件,但数据实际上不会粘贴到文档中.