无法在 Chimp 验收测试中单击离子侧菜单按钮答案

【问题标题】：Can't click an ion-side-menu button in Chimp acceptance test无法在 Chimp 验收测试中单击离子侧菜单按钮
【发布时间】：2016-08-20 00:14:54
【问题描述】：

我正在尝试编写一个验收测试，通过打开侧面菜单并单击“注销”按钮将用户注销。黑猩猩在抱怨，Uncaught Error: element not visible。这是我的测试：

it('user can log out @watch', function() {
    //navigates to login form, fills in the form and submits, verifies that we see the hamburger (sidemenu) button.
    loginUser(ROLE_TYPE_ADMIN);

    //click the hamburger menu to slide open (reveal) the side menu
    browser.click("button.ion-navicon");

    //wait for animation to finish
    browser.pause(500);

    //wait for my login button to be recognized
    browser.waitForVisible('.mes-chimp-logout');

    //click the logout button (never gets this far – Uncaught Error: element not visible)
    browser.click('.mes-chimp-logout');
});

我很奇怪，如果我取出 browser.click 行，它会成功，因为这意味着它是可见的，但下面的行抱怨它不可见。

其他一些见解：

如果我将侧边菜单按钮粘贴在前景内容中，在侧边菜单之外，我可以让它成为可点击的
侧边菜单外的前景内容是ion-pane。它使用 translate3d 样式滑动以显示侧边菜单

如何克服此错误并单击注销（或任何侧面菜单）按钮？

【问题讨论】：

可以分享waitForVisible的方法代码吗？？
@SaurabhGaur 它在那里，browser.waitForVisible
所以看看那里，可能它正在等待可见性并返回 WebElement 所以不需要再次找到就像browser.waitForVisible('.mes-chimp-logout').click();...:)
@SaurabhGaur 不幸的是，这给了我：Uncaught TypeError: browser.waitForVisible(...).click is not a function。我如何知道该浏览器 api 是哪个版本？我看到 WebdriverIO 让我选择我可以查看的文档版本，但我不知道我有哪个版本
应该像这里一样工作：webdriver.io/api/utility/waitForVisible.html - chimp 中的 webdriver.io 版本在这里：github.com/xolvio/sync-webdriverio/blob/master/package.json#L38

标签： meteor selenium-webdriver ionic-framework acceptance-testing chimp.js

【解决方案1】：

事实证明，尽管我只打算在选择器中使用一个元素，但实际上有两个。在运行时，Ionic Framework 似乎对与 ion-side-menu 相关的所有内容进行了一些重复，也许是出于动画目的，我不确定。在所有重复的元素中，一个永远不可见或填充（未填充角度模板）。当您在控制台中执行 $('.mes-chimp-logout') 时，您会看到两个元素出现。当您将鼠标悬停在好的按钮上时，它会突出显示 UI 中的按钮。当您将鼠标悬停在另一个上时，没有任何突出显示，因此它要么与 DOM 分离，要么在屏幕外/在某处不可见（这就是 WebDriverIO 认为它不可见的原因——一个是，一个不是）。我最终这样做了：

//get access to the element id of the second (index 1) copy of the element, the one I know is the visible, populated one.
const logoutBtnElementID = browser.elements('.mes-chimp-logout').value[1].ELEMENT;

//click it, using the target ID
browser.elementIdClick(logoutBtnElementID);

【讨论】：