Javascript 使用Chrome的MacBook上的Nightwatch.js不会触发点击事件

作为一个在nightwatch.js和使用javascript的测试自动化方面相对较新的人，我面临着许多问题，我以某种方式解决了这些问题，但现在我面临着一个我还无法解决的问题

接下来，nightwatch可以定位可见的元素，但不能单击它。这只发生在MacBook上，我还必须提到，在windows环境下，一切都按预期运行

到目前为止，我尝试过的是：

第一个解决方案：

//**expand hover menu**

 .waitForElementVisible('@hoverMenu', 1000)

.click('@hoverMenu')

//**wait one second and click on logout button**

.api.pause(1000)

.assert.visible('@logoutBtn')

.click('@logoutBtn')

//**expand hover menu**

 .waitForElementVisible('@hoverMenu', 1000)

.click('@hoverMenu')

//**wait one second and click on logout button**

.click('@logoutBtn',function(){

this.waitForElementVisible('@logoutBtn',10000);

this.click('@logoutBtn');

})

第二个解决方案：

//**expand hover menu**

 .waitForElementVisible('@hoverMenu', 1000)

.click('@hoverMenu')

//**wait one second and click on logout button**

.api.pause(1000)

.assert.visible('@logoutBtn')

.click('@logoutBtn')

//**expand hover menu**

 .waitForElementVisible('@hoverMenu', 1000)

.click('@hoverMenu')

//**wait one second and click on logout button**

.click('@logoutBtn',function(){

this.waitForElementVisible('@logoutBtn',10000);

this.click('@logoutBtn');

})

这是我得到的错误代码

✔ 元素div>div>aside>div.header\uuuuu rightbarHeader\uuuuuuuuunxvz2>div.radialMenu\uuuuuuuuuuuuuuuuuu2xy3s.header\uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu

✖ 测试元素是否可见。无法定位元素。-应为“true”，但得到“null”

问题是assert总是在传递，当它必须触发click事件时，它总是会失败。 另一件奇怪的事情是，在通过测试的错误消息中，我得到了完整的路径报告，而在失败的消息中只有“

@logoutBtn

”，这是页面对象抽象的一部分

我使用的是

selenium-server-standalone-3.0.1.jar

和最新版本的

chromedriver

。而我正在工作的网站是在

ReactJS

中创建的

---

提前感谢各位；）

这是必须单击的代码的屏幕截图

以及守则：

<span data-react-toolbox="font-icon" class="material-icons    
radialMenu__btnIcon___3fNWR iconButton__iconButton___clsLX" 
data-event="click focus" style="background: rgba(0, 0, 0, 0);">
<!-- react-text: 211 -->input<!-- /react-text -->
</span>

输入

只是为了澄清；是否有来自相关解决方案的错误消息？即

✔用于解决方案1和
✖来自解决方案2？您还可以为您尝试操作的元素发布一个HTML片段吗？发布该消息只是为了显示“@logoutBtn”和“#app>div>div>…”是同一个元素，该元素可以被识别为可见，但不能触发单击。为了显示断言通过时，它将显示完整的xpath，当它失败时，它将显示为“@logoutBtn”，我必须承认，我并不完全熟悉nightwatch或react，因此我不确定
@logoutBtn
在选择器中做什么；在xpath中，这是一个属性选择器，因此您是否尝试使用属性
logoutBtn
选择对象？如果没有，你能解释一下，我可以帮助你尝试解决这个问题。'@logoutBtn'和上面显示的xpath是同一个元素，logoutBtn是这个元素的简短版本，因为我在测试中使用了页面对象模式，所以让我们假设这是该元素的某种抽象，以避免干涸，并使我的测试更易于维护。更具体地说，我有另一个JS文件，其中我将其实例化为：logoutBtn:{selector:'#app>div>div>aside>div.header\uuuuu rightbarHeader\uuuuuu nXVZ2>div.radialMenu\uuuu radialMenu\uuuuuuuuuuuuuuu2xy3s.header\uuuuuuuuuuuuuuuu3ahzz>div.radialMenu二级按钮\uuuuuuuuuuuuuuuuuuuuu 2jrl>div:n子（1）>div'}，@timetraveler90为什么我们不在这里使用类名作为定位器，而不是完全遍历DOM？您可以在浏览器控制台中尝试一下，如果这个xpath是正确的：您可以通过启动应用程序并在控制台中键入：$x（“//span[@class='your_class\u name_here']”）来实现这一点