WebDriver 的图像（非元素）可见性答案

【问题标题】：Image (not element) visibility with WebDriverWebDriver 的图像（非元素）可见性
【发布时间】：2012-07-22 14:01:18
【问题描述】：

我有一个可点击的图像，但它在 FireFox 中不可见。我的意思是，没有图像，但是有一个元素（并且它是可点击的）。 FindElement(by).Displayed 返回 true 但仍然没有图像。问题是如何检查，这张图片是否可见？

另外，我在 html headers 中发现了一个错误（原因，为什么图像不可见），也许有一种方法可以使用 html headers 检查图像是否存在？

public bool IsFileIconDisplayed()
        {
            return IsElementDisplayed(By.XPath("//*[@class='SomeClass']/img"));

        }

protected bool IsElementDisplayed(By by)
        {
            return FindElement(by).Displayed;
        }

【问题讨论】：

那么是什么让它隐藏/消失/显示？它是否应用了任何 CSS？什么时候变成隐藏的？（即在页面加载时，当你将鼠标悬停在它上面时，什么？）
Ashwin Prabhu 下面给出了我的问题的答案，谢谢。

标签： c# html image webdriver

【解决方案1】：

图像是否具有将其宽度和高度设置为预设值的样式？

如果没有，您可以在 Javascript 中查询图像元素的客户端宽度和高度属性。

document.getElementById(<webElement>).getClientRects()[0].width
document.getElementById(<webElement>).getClientRects()[0].height

或者只是

document.getElementById(<webElement>).naturalWidth

使用 JavascriptExecutor，您应该能够将这些值绘制到您的 Java/C# 代码中，并根据其宽度/高度来确定图像已加载/未加载。

【讨论】：

不好，宽高> 0，所以test认为图片显示出来了。
这是意料之中的。不要与 0 比较。浏览器有一个后备图像，它采用固定的宽度和高度，通常小于 100 x 100。排除这种情况。这应该很容易。
我尝试了 document.getElementsByClassName("Class")[1].children[0].width 在 chrome 中（显示图像的位置）和 FireFox 中（显示图像的位置） '未显示），结果相同 - 60px。我做错了什么？
你试过 document.getElementById().naturalWidth 吗？（我已经更新了我的答案。）

【解决方案2】：

此线程包含有关如何检查图像可见性的宝贵信息（请特别注意 Dave Hunt 提供的答案）

How to check URL for 404 using Selenium WebDriver?

【讨论】：