如何在Protractor中检测元素列表是否存在至少一个已展示的元素

核心思路 #

先获取目标元素列表，遍历检测每个元素的isDisplayed()返回值，只要存在一个返回true的元素即满足条件。

实现方法 #

方法1：使用filter过滤可见元素后判断数量 #

写法简洁易读，适合绝大多数常规场景
代码示例：

// 替换为你的目标元素定位规则
const targetElements = element.all(by.css('.target-item-class'));

const hasDisplayedElement = targetElements.filter(elem => elem.isDisplayed()).count().then(count => {
  return count > 0;
});

// 可直接用于断言或逻辑判断
expect(hasDisplayedElement).toBe(true);

方法2：async/await 写法（适配关闭promise管理器的新版Protractor） #

如果你配置了SELENIUM_PROMISE_MANAGER: false，这种写法逻辑更清晰，且找到第一个可见元素就终止遍历，性能更好
代码示例：

async function hasVisibleElement(locator) {
  const elements = await element.all(locator);
  for (const elem of elements) {
    if (await elem.isDisplayed()) {
      return true;
    }
  }
  return false;
}

// 调用示例
const hasVisible = await hasVisibleElement(by.css('.target-item-class'));
console.log(hasVisible); // 存在可见元素返回true，无匹配元素/无可见元素返回false

注意事项 #

• 不要混淆isPresent()和isDisplayed()：isPresent()仅判断元素是否存在于DOM树中，哪怕元素被设置了display: none也会返回true；如果你的需求是只要DOM中存在就算符合条件，把上述代码里的isDisplayed()替换为isPresent()即可。
• 如果DOM中没有匹配定位规则的元素，两种方法都会返回false，符合预期。

内容的提问来源于stack exchange，提问作者Karthick sankar