Taking Full page screenshot of Web page using Selenium Webdriver

While executing a testcase, if the testcase fails, then we need to take a screenshot of the page for error reporting. This can also be done by using Selenium Webdriver.
We can use the following syntax  for capturing and saving full page screenshot.
File screenshot = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);

Then it can be stored in our local drive using the following syntax
FileUtils.copyFile(screenshot, new File(“D:\\screenshot.png”));

Now, here is the small example of webdriver script by which we can capture the full page screenshot.

package Screenshot;
import java.io.File;
import java.util.concurrent.TimeUnit;

import org.apache.commons.io.FileUtils;
import org.openqa.selenium.By;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.TakesScreenshot;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.firefox.FirefoxDriver;

public class FullPage_Screenshot {

    public static void main(String[] args) throws Exception {

        WebDriver driver = new FirefoxDriver(); 
         
        try{
            driver.get("http://google.co.in"); 
            driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
            driver.manage().window().maximize();
            
            //driver.findElement(By.xpath("//input[@id='gbqfq']")).sendKeys("test");
            driver.findElement(By.xpath("//input[@id='gbqfq1']")).sendKeys("test");
            System.out.println("Entered data in textfield");    
        }   
        catch (Exception e) 
        {  
            File scrFile = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);  
            FileUtils.copyFile(scrFile, new File("D:\\screenShot1.png"));
            System.out.println("Screenshot is captured for failed testcase");
        }  
    }  
}

// driver.findElement(By.xpath(“//input[@id=’gbqfq’]”)).sendKeys(“test”);

If we execute this statement, then we can enter data into the text field and the testcase will pass. So, it will not take the screenshot.

So, I  have commented out the correct statement so that the testcase will fail and screenshot will be captured.

Hope this will help you 🙂

Perform Drag and Drop of Elements using Selenium Webdriver

In this post, i will give a simple example of script which will perform drag and drop operation of elements

Lets take an example of the site ‘http://jqueryui.com/droppable’
Here we can see 2 elements. One is draggable which is called the Source element. It will be dragged from one location and dropped in another location which is called Target.

There are different ways to write the script for drag and drop. I will describe few ways i have tried.

1st way:
act.dragAndDrop(Source, Target).build().perform();

2nd way:
act.clickAndHold(From).build().perform();
act.moveToElement(To).build().perform();
act.release(To).build().perform();

3rd way:
act.dragAndDropBy(Source, xoffset, yoffset).perform();

Write the following code into Eclipse IDE and then run the script.

package JqueryPackage;
import java.io.IOException;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.interactions.Actions;

public class JqueryElements {

    public static void main(String[] args) {

    WebDriver driver = new FirefoxDriver();
    driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
    driver.get(“http://jqueryui.com/droppable/#default”);
    driver.manage().window().maximize();

    Actions act = new Actions(driver);

    // Script for dragging an element and dropping it in another place
    WebElement iFrame = driver.findElement(By.tagName(“iframe”));
    System.out.println(iFrame.getSize());
    driver.switchTo().frame(iFrame);

    WebElement From = driver.findElement(By.id(“draggable”));
    System.out.println(From.getLocation());

    WebElement To = driver.findElement(By.id(“droppable”));
    System.out.println(To.getLocation());

    act.dragAndDrop(From, To).build().perform();

    }
}

We can replace the last line by any one of the following codes to perform the drag and drop.

act.clickAndHold(From).build().perform();
act.moveToElement(To).build().perform();
act.release(To).build().perform();

OR

act.dragAndDropBy(From, 140, 18).perform();

Here 140 and 8 are the x and y offset of the target element.
We can find the location of the element by using the getLocation() method

Hope this will help 🙂