我正在使用 Mocha test framework 编写一些测试和 Chai assertions library我一直在 Chrome 浏览器中测试它们,它们工作正常,但后来我在 headless 浏览器中尝试它们 mocha-phantomjs我在某些元素上发送的 .click() 事件似乎没有触发,而其他元素正在工作。
测试成功登录网站,使用:
$("#login").click()
“#login”是一个表单提交按钮,使用这种方式单击可以正常工作。
接下来我想单击一个作为 anchor 元素的菜单项。
$("#menuItemToClick").click();
这是它在 mocha-phantomjs 中停止工作的地方,尽管它在 chrome 中工作得很好。
很明显,.click() 函数已定义并且可以工作,但不适用于该元素。
我已经用完了我的 google-foo。以下是我看到其他人提到并尝试过的一些其他事情:
使用 JavaScript 调度事件
var evObj = new CustomEvent('click');
evObj.initEvent('click', true, false);
document.getElementById('menuItemToClick').dispatchEvent(evObj);
这确实会触发点击事件并将浏览器带到正确的网址,但它也会导致整个页面在 chrome 和 mocha-phantomjs 中重新加载,这会从头开始重新启动测试,使它们陷入无限循环。 .有没有办法使用它而不导致页面重新加载?
使用phantomjs的page.sendEvent()
var elementPosition = $("#menuItemToClick").offset();
page.sendEvent('click', elementPosition.left + 1, elementPosition.top + 1);
如果您向其传递元素的正确坐标,则应该发送 native 单击事件。我试图让它工作,但我似乎无法从正在运行的 Mocha 测试中访问该页面。有没有办法从 mocha-phantomjs 测试中访问 phantomjs 页面变量?
非常感谢任何帮助!
最佳答案
我回去又玩了一会儿,终于让dispatchEvent在不重置页面的情况下工作,并且它在chrome和mocha-phantomjs中都可以工作!我认为页面重置/重新加载与该事件不是专门的鼠标事件有关。
我在测试的顶部放置了一个便利函数:
var clickElement = function (el){
var ev = document.createEvent("MouseEvent");
ev.initMouseEvent(
"click",
true /* bubble */, true /* cancelable */,
window, null,
0, 0, 0, 0, /* coordinates */
false, false, false, false, /* modifier keys */
0 /*left*/, null
);
el.dispatchEvent(ev);
};
现在可以点击我的 anchor 元素:
clickElement($("#menuItemToClick")[0]);
关于jquery - .click() 在 mocha-phantomjs 中对某些元素不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16802795/