How to Take a Screenshot in Selenium WebDriver Using Java?

Selenium WebDriver is a collection of open-source APIs that are used to automate the testing of a web application. To capture a screenshot in Selenium, one has to utilize the method Takes Screenshot. This notifies WebDriver that it should take a screenshot in Selenium and store it.

Selenium WebDriver tool is used to automate web application testing to verify that it works as expected. It supports many browsers. Here we will be taking the example of Chrome.

Why take screenshots in Selenium?

The document talks about the importance of screenshots in automated testing with Selenium. Here is the key idea in simpler terms:

• Re-running an entire test after a failure wastes time. Ideally, the test should pinpoint the exact error.
• Similarly, testers need to visually verify if an application works as expected. Screenshots help with that.
• Selenium WebDriver, a popular test automation tool, lets you take screenshots during tests.

Here are some situations when screenshots are particularly useful in Selenium tests:

• When the application crashes or behaves strangely.
• When a test fails an assertion (a built-in check to verify something is true).
• When the test has trouble finding elements on a webpage.
• When the test times out waiting for elements to load.

How to take screenshots in Selenium WebDriver?

Syntax:

File file = ((TakesScreenshot) driver) ;

Here, we will learn how to take a screenshot in the selenium web driver and highlight the element using Java Binding.

Screenshots are required for bug analysis especially in the case of test case failure. Whenever a test case fails, we need some attachment to verify that failure. Selenium can automatically take a screenshot during execution, and we can also mark a border to highlight that element.

Example of Taking a Screenshot in Selenium WebDriver

Step 1. Take a screenshot and store it in a file format

Step 2. Copy screenshot to a location using CopyFile method  

FileUtils.copyFile(File, new File(“location where you want to save the image” +FileName+ “.jpeg”)); 

Step 3. Create a border around the element: Using the JavaScript executor, we can create a border around the desired element.

JavascriptExecutor js = (JavascriptExecutor) driver; js.executeScript(“arguments[0].style.border = ‘3px solid red'”, Element);

Refer to the complete code below for the implementation part

Java

// Java program how to take
// a screenshot in Selenium
// WebDriver

import java.io.*;

class GFG {
    public static void main(String[] args)
    {
        // Setting webDriver to chrome
        System.setProperty("webdriver.chrome.driver",
                           "driver path");
        driver = new ChromeDriver();
        driver.get("https://www.google.co.in");

        WebElement Element = driver.findElement(
            By.xpath("//input[@name='q']"));

        // Assignments to webDriver
        MakeBorder(Element);
        Thread.sleep(2000);
        TakeScreenshot("GooglePage");
        driver.quit();
    }

    // Function to Take screenshot
    public static void TakeScreenshot(String FileName)
        throws IOException
    {
        // Creating instance of File
        File File = ((TakesScreenshot)driver)
                        .getScreenshotAs(OutputType.FILE);

        FileUtils.copyFile(File,
                           new File("image location"
                                    + FileName + ".jpeg"));
    }

    // Function to Make border
    public static void MakeBorder(WebElement Element)
    {

        JavascriptExecutor js = (JavascriptExecutor)driver;
        js.executeScript(
            "arguments[0].style.border = '3px solid red'",
            Element);
    }
}

Output: