Question

我想知道，如果有可能以及如何检查，一个应该显示图片的元素是否真的能够显示图片。

图片位于<img src=..>且位于同一域内。

Answer 1

目前还不完全清楚你的目标是什么。我认为可以安全地假设，如果你的代码做的一切正确（例如：网址是正确的，并且css规则不会导致元素被隐藏），那么浏览器就会做它所做的事情。 s应该做并显示图像。当然，如果你是真正测试浏览器本身的测试团队，那就是另一个问题。

因此，假设浏览器的行为正确，以下是一些建议：

您可以使用Page should contain image属性来验证元素是否在DOM中。
您可以使用Get Element Attribute关键字获取src属性的值，然后使用Get的requests library关键字验证url返回200状态代码。
您可以使用Element should be visible关键字验证css规则是否允许显示该元素。

这是一个完整的工作示例：

*** Settings ***
| Library | Selenium2Library
| Library | RequestsLibrary

*** Variables ***
| ${TEST_PAGE} | http://the-internet.herokuapp.com/hovers
| ${BROWSER}   | chrome

*** Keywords ***
| Assert an image is visible
| | [Arguments] | ${element id}
| | [Documentation]
| | ... | This keyword fails if the given image element is not visible.
| | ... | Three checks are performed: that the element is on the page,
| | ... | that selenium thinks the element is visible, and that the 
| | ... | src attribute of the image points to a resource that is 
| | ... | accessible. 
| | 
| | # Step 1: verify the page contains the given element
| | Page should contain image | ${element id}
| | 
| | # Step 2: verify that the element is visible
| | Element should be visible | ${element id}
| | 
| | # Step 3: verify the src attribute of the image is accessible
| | ${img src}= | Get element attribute | ${element id}@src
| | Create session | img-src | ${img src}
| | ${response} | Get | img-src | / | # URL is relative to the session URL
| | Should be equal as integers | ${response.status_code} | 200
| | ... | image url '${img src}' returned unexpected status code '${response.status_code}'
| | ... | show_values=False

*** Test Cases ***
| Example of test to verify an image is visible
| | [Documentation]
| | ... | Verify that the first image on the test page is visible
| | 
| | [Setup] | Open browser | ${TEST_PAGE} | ${BROWSER}
| | Assert an image is visible | //div[@class='figure']/img
| | [Teardown] | Close All Browsers

Answer 2

除了元素可见方面，您还可以通过javascript检查图像元素是否由浏览器实际呈现，而不是显示一些丢失的图像图标。您可以使用Selenium2Library执行javascript或将Selenium2Library javascript关键字调用包装到自定义关键字中，以使其更具可读性。

http://watirmelon.com/2012/11/27/checking-an-image-is-actually-visible-using-webdriver/

Answer 3

我知道此线程有些旧，但是我发现了另一种无需请求库的方法：

*** Variables ***
${avatar} | css: span.avatar_circle > img

*** Test Cases ***
Check Avatar From WordPress
| [Documentation] | Check if the user image is ok
| [Tags] | avatar | noncritical    
| Click Element | ${avatar}
| Wait Until Page Contains  | Latest Blog
| Page Should Contain Image | ${avatar}
| Element Should Be Visible | ${avatar}
| ${src}= | Get Element Attribute | ${avatar} | src
| Go To | ${src}
| Wait Until Element Is Visible | css: img
| Go Back

Answer 4

据我所知，没有Robot Framework库可以测试实际显示的图像。有几个选择：

考虑将Sikuli与Robot Framework集成。有一些指南可以指导您一步一步的整合。一旦Sikuli使用Robot Framework，请截取您的图像并将其与基本屏幕截图进行比较。我认为这是你最好的选择。
还有其他工具可以进行视觉图像比较。例如，Needle是用Python编写的，所以如果你有一些Python技能，你可以编写一个关于Needle功能的库。

检查图像文件是否存在，Robot-Framework，Selenium2Library

4 个答案: