在当前视图中定位元素答案

【问题标题】：locate an element in current view在当前视图中定位元素
【发布时间】：2012-02-16 14:36:12
【问题描述】：

当我使用WebElement#findElement(By) 和By.cssSelector 方法时，它会在整个页面中搜索元素。但我想通过仅当前视图来限制选择。我不想让 Selenium “使用滚动条”。我怎样才能做到这一点？

【问题讨论】：

我对这个用例非常感兴趣，因为编写不同的 CSS 选择器/XPath 表达式非常容易......

标签： java firefox selenium webdriver

【解决方案1】：

实现这一点的方法可能是获取页面上的所有元素，然后从视口中过滤掉这些元素。

WebElement.getLocation() 是一个基础工具。

如果你在页面的左上角（加载后默认），你可以使用window.innerHeight和window.innerWidth（大多数浏览器，但IE9+）。

// assuming JS is enabled for this instance of driver
JavascriptExecutor js = (JavascriptExecutor)driver;

int viewportWidth = (Integer)js.executeScript("return window.innerWidth;");
int viewportHeight = (Integer)js.executeScript("return window.innerHeight;");

List<WebElement> list = driver.findElements(By.cssSelector("whatever"));
for (Iterator<WebElement> iter = list.iterator(); iter.hasNext(); ) {
    WebElement elem = iter.next();
    Point p = elem.getLocation();
    if ((p.getX() > viewportWidth) || (p.getY() > viewportHeight)) {
        iter.remove();
    }
}

如果您不能确定视口将处于其默认位置（在坐标 [0, 0] 处），您可以在条件中添加 window.mozInnerScreenX 和 window.mozInnerScreenY（需要 Firefox 3.6+）。或者，可能更好，window.scrollX 和 window.scrollY。

您还必须定义是否包含部分显示的元素并相应地调整算法（WebElement.getSize() 来救援！）。

如果您在搜索后遇到问题，视口发生变化，请尝试通过window.scroll() 滚动回原始位置。

【讨论】：