selenium - 迭代页面上的元素并使用 nightwatchjs/selenium 单击它们

Question

如何迭代页面上具有特定类名的元素并单击它们？我尝试使用

browser.elements('css selector', element.articleItemTitle,function (links) {
        for (var i=0; i < links.value.length; i++) {
            browser.waitForElementVisible('body');
            browser.pause(1000);
            browser.elementIdClick(links.value[i].ELEMENT);
            browser.waitForElementVisible('.article-detail');
            browser.expect.element(element.postHeroTitle).to.be.present;
            browser.back();
        }
});

但每次迭代循环时，它并不总是单击指定的元素。

我收到错误:过时的元素引用:元素未附加到页面文档

使用夜巡

Answer 1

在迭代另一个页面的元素列表(links)时，您无法更改 DOM(例如，通过加载新页面)。一旦您更改页面，您就有使列表无效的风险，在这种情况下，下次循环时您将收到该错误。

不要将元素视为属性的集合，而是将其视为 being 'proxy' objects进入真实浏览器中的真实数据页面。它们只适用于当前页面，不可忽视。

对于解决方案，在您的情况下，您从 links 元素中使用的唯一内容似乎是 Id，它只是一个无害的字符串。因此，不要迭代匹配的元素，而是首先构建所有Id 字符串的列表，然后迭代该列表。这应该是您需要的唯一更改。

更新:

示例代码(未经测试，也不是优雅的 JavaScript，但可能有效，并演示了概念):

var ids = {};

// build the list of matching Ids on current page
browser.elements('css selector', element.articleItemTitle,function (links) {
    ids.push(links.value[i].ELEMENT);
});

// Try each one in turn - note *no references* held to existing page
for (var i = 0; i < ids.length; i++) {
    browser.waitForElementVisible('body');
    browser.pause(1000);
    browser.elementIdClick(ids[i]);
    browser.waitForElementVisible('.article-detail');
    browser.expect.element(element.postHeroTitle).to.be.present;
    browser.back();
}