Question

在以下代码中，我有两个显示不同颜色列的<div>标记，一个红色，一个绿色：

<html>
    <body>
        <style>
        html, body {
            height: 100%;
        }

        #red {
            width:50%;
            background: #f00;
            height: 100%;
        }
        #green {
            width: 250px;
            background: #0f0;
            height: 100%;
        }
        </style>
        <div id="red">
        </div>
        <div id="green">
        </div>
    </body>
</html>

显示时，红色div标签完全覆盖绿色div标签，因为红色区域的宽度百分比大于绿色的像素宽度。（你可以看到这个on JFiddle）

我遇到的问题是，在Selenium中，我找不到以编程方式验证绿色div是否对用户可见的方法。尝试greenDivWebElement.isDisplayed()使用上面的代码返回true，尽管用户无法看到它。

我确实发现做greenDivWebElement.click()确实显示绿色div不可见，因为引发了以下错误：

org.openqa.selenium.WebDriverException: unknown error: Element is not clickable at point (133, 361). Other element would receive the click: <div id="red">...</div>

然而，这个解决方案在现实世界中对我不起作用，因为我想检查点击时做某事的可见性，而我想确保它们对用户可见，我不想让他们被点击。

那么，如果WebElement由于CSS而被覆盖，我怎么能检查它是否对用户可见？

Answer 1

我最近遇到了类似的要求。我还没有实现完整的解决方案，但从高层次来看，这些是我正在采取的步骤。验证元素A未与任何其他元素重叠

获取有问题的元素，将元素的click（）事件绑定到不执行任何操作的函数。
点击元素的9个点 - 中心;顶部：左，中，右;中：左，右;底部：左，中，右。默认情况下，Selenium会点击中心点的元素。其他点可以通过元素的DOM定位计算，然后移动到相应的点。
在try / catch中包含步骤2中的调用块以检查Element not clickable...异常。
如果抛出异常，则元素在其中一个点击点处与另一个重叠。

这里的挑战绝对是click事件的绑定/解除绑定。对于我的特殊情况，使用JQuery直接实现绑定。

我最初想到处理点击问题的另一种方法是在运行测试之前禁用驱动程序中的Javascript。但是，当然，只有在渲染页面元素时不涉及JS技巧时，这种方法才有效。

挑战的第二部分是点击点的粒度。沿着边缘的8个点通常可以工作，但如果点击点之外有重叠，那么点击点的数量必须被提升。

检查用户是否可以看到WebElement（由CSS引用）

1 个答案: