Pages

Wednesday 24 April 2013

Finding broken images in a page using Selenium Webdriver

What is broken images?

Broken image as the name signifies the web page code refers to an image location(i.e src of the image) is either incorrect or out of date. When you try to search that image at the specified location written in the code you wont be able to find that image.

Reason for broken images :-

There are three possible reasons why your images are not showing up on your pages as expected:
(1) The image file is not located in the same location that is specified in your IMG tag
(2) The image does not have the same file name as specified in your  tag  and 
(3) The image file is either corrupted or damaged.

Code for finding broken images through Selenium :-

WebDriver driver = new FirefoxDriver();
EventFiringWebDriver eventFiringWebDriver = new EventFiringWebDriver (driver);

// Storing all the image elemt  in the variable allImages
List<WebElement> allImages = 
eventFiringWebDriver.findElements(By.tagName("img"));
int countBrokenImages = 0;

// Declaring a dynamic  string of array which will store src of all the broken images
List<String> BrokenimageUrl = new ArrayList<String>();

String script = "return (typeof arguments[0].naturalWidth!=\"undefined\" &&  
arguments[0].naturalWidth>0)";

for (WebElement image : allImages) 
{   
        Object imgStatus = eventFiringWebDriver.executeScript(script, image);          
if(imgStatus.equals(false))
{
String  currentImageUrl = image.getAttribute("src");
String imageUrl = currentImageUrl ;
                BrokenimageUrl.add(imageUrl);
                countBrokenImages++;
         }
}

// Printing the src of the broken images if any
System.out.println("Number of broken images found in the page : " +countBrokenImages);
for (String z : BrokenimageUrl) 
{
    System.out.println(z);
}

Hope the above code resolved your problem.

4 comments:

  1. Great post!!! Surely help all of them whoever has faced this type of situation sooner or later.

    ReplyDelete
  2. Great post!. How can I do to verify just one image.. it's always returning me false when the images are displayed and when the red cross is displayed too. Should I edit the script?, can you please help me with this?. Thanks in advance

    ReplyDelete
  3. Hi Melkor,

    To verify one image, Just remove looping and give locator specific to the image. This should look something like the following :

    WebDriver driver = new FirefoxDriver();
    EventFiringWebDriver eventFiringWebDriver = new EventFiringWebDriver (driver);
    WebElement image = eventFiringWebDriver.findElement(locator);
    String script = "return (typeof arguments[0].naturalWidth!=\"undefined\" &&
    arguments[0].naturalWidth>0)";
    Object imgStatus = eventFiringWebDriver.executeScript(script, image);

    Now verify whether imgStatus returns true or false and you should be good to go.

    Regards,
    Selenium@Mindfire
    http://www.mindfiresolutions.com/

    ReplyDelete
  4. Great post!! Thank you.

    Please tell me the code to find the broken links in a webpage. I have tried below code but receiving an error:

    import java.util.ArrayList;
    import java.util.List;

    import org.openqa.selenium.By;
    import org.openqa.selenium.WebDriver;
    import org.openqa.selenium.WebElement;

    import org.openqa.selenium.firefox.FirefoxDriver;


    public class FindBrokenLinks {


    public static void main(String[] args) throws InterruptedException {
    WebDriver driver = new FirefoxDriver();
    driver.get("https://www.xyz.com/");
    Thread.sleep(5000L);
    int size = driver.findElements(By.tagName("a")).size();

    System.out.println(size);

    List Linkarray = new ArrayList();

    List Linklist = driver.findElements(By.tagName("a"));

    for (WebElement link : Linklist) {

    String links = link.getText();
    Linkarray.add(links );

    }
    for (String linkToTest : Linkarray){
    driver.findElement(By.linkText(linkToTest)).click();
    Thread.sleep(15000L);
    if(driver.getTitle().contains("Problem")) {
    System.out.println("Fail");
    }
    else
    {
    System.out.println("pass");
    }
    driver.navigate().back();
    Thread.sleep(5000L);
    }

    driver.close();

    }
    }

    Receiving below error:

    Exception in thread "main" org.openqa.selenium.StaleElementReferenceException: Element is no longer attached to the DOM
    Command duration or timeout: 9 milliseconds
    For documentation on this error, please visit: http://seleniumhq.org/exceptions/stale_element_reference.html
    Build info: version: '2.43.1', revision: '5163bce', time: '2014-09-10 16:27:58'

    ReplyDelete