我正在使用
Mocha test framework和
Chai assertions library编写一些测试,我已经在chrome浏览器中测试了这些测试,但它们工作正常,但是我尝试在无头浏览器
mocha-phantomjs和.click()事件中,我发送某些元素只是没有似乎在射击,而其他人正在工作.
测试成功登录到网站,这是使用：
$("#login").click()
“#login”是一个表单提交按钮,它可以很好的使用点击这种方式.
接下来我想点击一个菜单项,这是一个锚点元素.
$("#menuItemToClick").click();
这是在mocha-phantomjs停止工作的地方,即使这在Chrome中正常工作.
所以显然.click()函数是定义和工作,但不是这个元素.
我已经用尽了我的google-foo.这里有一些其他的东西我看到别人提到和尝试：
使用javascript dispatchEvent
var evObj = new CustomEvent('click');
evObj.initEvent('click',true,false);
document.getElementById('menuItemToClick').dispatchEvent(evObj);
这样做会触发点击事件,并将浏览器引导到正确的URL,但它也会导致整个页面重新加载,在chrome和mocha-phantomjs中,从一开始就重新启动测试,将它们放在无限循环中…有没有一种使用这种方式,而不会导致页面重新加载？
使用phantomjs的page.sendEvent()
var elementPosition = $("#menuItemToClick").offset();
page.sendEvent('click',elementPosition.left + 1,elementPosition.top + 1);
如果您将元素的正确坐标传递给本地点击事件,则应发送本地点击事件.我试图让这个工作,但似乎无法从运行的摩卡考试中访问该页面.有没有办法从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,/* coordinates */
false,false,/* modifier keys */
0 /*left*/,null
);
el.dispatchEvent(ev);
};
现在可以点击我的锚点：
clickElement($("#menuItemToClick")[0]);
