单击元素时量角器测试挂起答案

【问题标题】：Protractor test hangs when clicking on element单击元素时量角器测试挂起
【发布时间】：2014-02-21 15:52:22
【问题描述】：

我一直在尝试编写一个量角器测试，从自定义下拉菜单中选择一个项目。唯一的问题是，当它尝试单击列表中最后一个元素以外的元素时，它会挂起并超时。当我删除 click() 方法调用时，它似乎工作正常。由于所有这些调用都是异步完成的，我也看不到在找到元素时停止循环的方法。我的代码如下所示：

    var it = null;
    for(var i = 1; i <= totalNumberOfAccounts; i++) {
        var listItemLocator = '//div[@id="payment-accounts"]/div/ul/li[' + i + ']/label/div/div[2]/div[2]/span[2]';
        var item = browser.driver.findElement(protractor.By.xpath(listItemLocator));
        item.getText().then(function(value) {
            if(value === accountNumber) {
                it = item;
            }
           console.log(value);
        })
        .then(function clickOption() {
            console.log('Clicking...');
            if (it) {
                console.log('Clicking desired item');
                it.click();
                console.log('Clicked..');
            }
        })
    }

我也试过这种方法：

this.selectRichSelectOption = function (selector, item) {

    var selectList = browser.driver.findElement(selector);
    selectList.click();

    var desiredOption = '';
    var i = 1;
    selectList.findElements(protractor.By.tagName('li'))
        .then(function findMatchingOption(options) {

            console.log(options);

            options.some(function (option) {

                console.log('Option:');
                console.log(option);
                var listItemLocator = '//div[@id="payment-accounts"]/div/ul/li[' + i + ']/label/div/div[2]/div[2]/span[2]';
                console.log(listItemLocator);
                var element = option.findElement(protractor.By.xpath('//label/div/div[2]/div[2]/span[2]'));
                console.log('Element:');
                console.log(element);
                i++;

                element.getText().then(function (value) {
                    console.log('Value: ' + value);
                    console.log('Item:');
                    console.log(item);
                    if (item === value) {
                        console.log('Found option..');
                        desiredOption = option;
                        return true;
                    }
                    return false;
                });
            });
        })
        .then(function clickOption() {
            console.log('Click option');
            console.log(desiredOption);
            if (desiredOption) {
                console.log('About to click..');
                desiredOption.click();
            }
        });
};

这个结果就更奇怪了。现在突然 getText() 方法调用返回一个空字符串。但是当我尝试检索例如类属性我得到了正确的值。 Text 值去哪了？

有人可以帮帮我吗？

【问题讨论】：

我不完全理解您的问题，您在哪些浏览器上进行了测试？我遇到了一个issue on Firefox with options，一般来说还有其他的下拉菜单。
我在 Chrome 上运行了测试。正常的下拉菜单工作正常。我们正在使用由多个 div 和 ul 标签构建的自定义下拉菜单。一般来说，这并不是什么大问题，因为您可以使用 xpath 访问元素。使用普通的 Selenium API（不是 webdriver），我实际上可以通过使用 xpath 循环遍历元素来实现我想要的。使用 Selenium Webdriver API，这似乎有点复杂。因为他们使用异步调用链来遍历元素。
我目前遇到的问题是，每当我通过选项并尝试通过调用 getText() 来获取文本值时，它似乎是空的。所以我的比较无法从下拉列表中找到我想要选择的元素。
当我使用循环方法（第一个）时，它似乎只有在我尝试选择下拉列表中的最后一项时才有效。每当我尝试选择除最后一个项目之外的任何其他项目时，它基本上都会挂起，并且无论出于何种原因测试超时。

标签： javascript angularjs selenium-webdriver protractor

【解决方案1】：

这似乎是页面加载的问题。选择后，页面未完全加载。

尝试使用 browser.sleep(timeInMs);

【讨论】：

【解决方案2】：

尝试使用节点 8+ 的异步函数，例如 await。我经历了这个头痛，awaiting 解决了某些事情出现或具有某些属性。

await browser.wait(EC.presenceOf(element(by.xpath('path leading to element based off attribute'))))

祝你好运

【讨论】：