Question

我正在使用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);

这会触发click事件并将浏览器带到正确的url，但它也会导致整个页面重新加载，在chrome和mocha-phantomjs中，从一开始就重新启动测试，将它们置于无限循环中。有没有办法使用它而不会导致页面重新加载？

使用phantomjs'page.sendEvent（）

var elementPosition = $("#menuItemToClick").offset();
page.sendEvent('click', elementPosition.left + 1, elementPosition.top + 1);

如果您传递元素的正确坐标，则应该发送本机点击事件。我试图让它工作但我似乎无法从正在运行的mocha测试中访问该页面。有没有办法从mocha-phantomjs测试中访问phantomjs页面变量？

非常感谢任何帮助！

Answer 1

我回去玩了一会儿，最后让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);
};

现在可以点击我的锚元素：

clickElement($("#menuItemToClick")[0]);

.click（）在某些元素的mocha-phantomjs中不起作用

使用javascript dispatchEvent

使用phantomjs'page.sendEvent（）

1 个答案: