量角器失败：元素不可交互答案

【问题标题】：Protractor Failed: element not interactable量角器失败：元素不可交互
【发布时间】：2019-05-12 11:46:06
【问题描述】：

我正在为 Angular 7.x 应用程序运行 E2E 测试。测试在我的本地机器上直接运行。但是当我将它推送到 repo (GitLab) 时，管道失败并抛出以下错误：

用户个人资料 - 检查和更改个人资料 - 失败：元素不可交互（会话信息：chrome=71.0.3578.80）（驱动信息：chromedriver=2.45.615279 (12b89733300bd268cff3b78fc76cb8f3a7cc44e5),platform=Linux 4.14.74-coreos x86_64）

测试用例：

it('USER PROFILE - Check and change PROFILE', () => {

    page.navigateTo();

    browser.sleep(1000);
    expect(page.getProfileEditTagName()).toMatch('app-edit-profile');

    expect(element(by.className('logged-as')).getText()).toBe( testEmail );


    browser.actions().mouseMove( element.all( by.id('editIcon-salutation') ).get(0)).click().perform().then(function () {
        browser.sleep(4000);

        element( by.className('mat-select-arrow') ).click().then(function () {

            browser.actions().mouseMove( element.all(by.className('option-value mat-option')).get(0)).click().perform();
            browser.sleep(1000);
            browser.actions().mouseMove( element.all( by.id('saveButton-salutation') ).get(0)).click().perform();
            browser.sleep(1000);

        });
    });

});

navigateTo() 只是 profile.po.ts 中的一个方法：

navigateTo() {
    browser.get('/profileComponentUrl');
}

让我感到困惑以及我什至无法本地化错误或错误之处在于它在本地运行良好。但是一旦我推动回购，那么它就在那个测试用例中失败了。请问有什么提示吗？

【问题讨论】：

我猜 jenkins slave 上的页面加载速度不如您本地的快。您可以注释该it的所有代码行，然后逐行注释掉以确认行需要更多时间等待。

标签： protractor e2e-testing

【解决方案1】：

我遇到了同样的问题，我找到了this。

我复制粘贴了它（以及其他一些小的调整，例如强制单击 for 循环中的上一页）并且它起作用了。我相信browser.driver.manage().window().maximize(); 是解决方案的一部分。

【讨论】：

【解决方案2】：

我建议：

在量角器配置中启用堆栈跟踪：new SpecReporter({ spec: { displayStacktrace: true } })，这样您就可以准确地看到引发错误的元素。这不会解决问题，但至少应该为您指明正确的方向。
然后，如果您使用选项卡、按钮或其他隐藏/显示/禁用/启用或更改 DOM 视图的元素，则在调用 .click() 后添加 browser.sleep(100)

【讨论】：

【解决方案3】：

我发现的一个原因是滚动问题。您需要检查元素是否正确显示。它可能是隐藏的。所以使用 scrollToTop/scrollToElement/scrollToElementView 等。您可以编写更适合条件的不同滚动方法。

另一个原因是定位器。尝试更换定位器，不要过度修剪定位器。只需尝试使用全身 css 定位器，如果它有效，则正确修剪。在 chrome 控制台中的某些时候它可能会起作用，但不适用于测试用例。

【讨论】：

【解决方案4】：

元素不可交互的原因可能是 - 对隐藏或模糊的元素执行操作。

你可以试试—— 1. 在 by.className('mat-select-arrow') ).click() 之后添加睡眠，我可以看到你没有在那里添加任何等待。 2. 尝试检查您是否在本地和 Jenkins 机器上以相同的屏幕分辨率运行测试。（这可能是元素被遮挡的原因）

【讨论】：

可能我不得不提到 mat-select 被 onInit/load 禁用/只读。然后我在点击editIcon-salutation 时将其变为可编辑/启用。之后mat-select 是可编辑的，我可以打开它，选择特定选项并保存我的选择等。但我不认为这是回购错误背后的真正原因。
在 jenkins 上运行时，你能看到它在什么时候失败了吗？是否在 jenkins 上启用了 editIcon-salutation ？不同的屏幕分辨率怎么样？
分辨率已更改为：1366x768 还是不够？