Capturing screenshots in Selenium WebDriver is crucial for debugging and reporting test results. Selenium provides multiple ways to take screenshots of web pages, elements, or even specific areas of the screen.


πŸ› ️ Why Take Screenshots in Selenium?

Screenshots help in: ✔️ Debugging failed test cases
✔️ Generating visual test reports
✔️ Tracking UI changes over time
✔️ Capturing error messages for analysis


🎯 Different Ways to Take Screenshots in Selenium

✅ 1. Taking a Full Page Screenshot Using TakesScreenshot

Selenium provides the TakesScreenshot interface, which allows capturing the entire visible area of a webpage.

πŸ”Ή Example: Capturing Full Web Page Screenshot

import org.openqa.selenium.*;
import org.openqa.selenium.chrome.ChromeDriver;
import java.io.File;
import java.io.IOException;
import org.apache.commons.io.FileUtils;

public class ScreenshotExample {
    public static void main(String[] args) throws IOException {
        // Setup WebDriver
        WebDriver driver = new ChromeDriver();
        driver.get("https://example.com");

        // Capture screenshot
        TakesScreenshot ts = (TakesScreenshot) driver;
        File src = ts.getScreenshotAs(OutputType.FILE);

        // Save the screenshot
        FileUtils.copyFile(src, new File("screenshot.png"));

        // Close browser
        driver.quit();
    }
}

πŸ”Ή Explanation:

  1. Convert WebDriver instance to TakesScreenshot.
  2. Capture the screenshot using getScreenshotAs(OutputType.FILE).
  3. Save the screenshot to a desired location.

✅ 2. Taking a Screenshot of a Specific WebElement

Instead of capturing the full page, you may need a screenshot of a particular element (e.g., a button, form, or image).

πŸ”Ή Example: Capturing a Specific WebElement

WebElement element = driver.findElement(By.id("logo"));

// Capture screenshot of the element
File src = element.getScreenshotAs(OutputType.FILE);

// Save the screenshot
FileUtils.copyFile(src, new File("element_screenshot.png"));

πŸ”Ή Key Benefits: ✔️ Helps in verifying specific UI elements
✔️ Useful for capturing error messages or pop-ups


✅ 3. Taking a Full-Page Screenshot (Beyond Visible Area)

Selenium’s default TakesScreenshot only captures the visible part of a webpage. For capturing the entire page (including scrollable areas), you can use third-party libraries like Ashot.

πŸ”Ή Example: Using Ashot for Full-Page Screenshot

import ru.yandex.qatools.ashot.AShot;
import ru.yandex.qatools.ashot.Screenshot;
import ru.yandex.qatools.ashot.shooting.ShootingStrategies;
import org.openqa.selenium.*;
import org.openqa.selenium.chrome.ChromeDriver;

import javax.imageio.ImageIO;
import java.io.File;
import java.io.IOException;

public class FullPageScreenshot {
    public static void main(String[] args) throws IOException {
        WebDriver driver = new ChromeDriver();
        driver.get("https://example.com");

        Screenshot screenshot = new AShot()
            .shootingStrategy(ShootingStrategies.viewportPasting(1000))
            .takeScreenshot(driver);

        ImageIO.write(screenshot.getImage(), "PNG", new File("fullpage_screenshot.png"));

        driver.quit();
    }
}

πŸ”Ή Why Use AShot?
✔️ Captures entire page, including scrollable content
✔️ Supports high-resolution images
✔️ Can be used for image comparison


✅ 4. Capturing Screenshots on Test Failure (TestNG)

To capture screenshots automatically when a test case fails, use TestNG’s @AfterMethod.

πŸ”Ή Example: Take Screenshot on Failure

import org.openqa.selenium.*;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.*;
import java.io.File;
import java.io.IOException;
import org.apache.commons.io.FileUtils;

public class ScreenshotOnFailure {
    WebDriver driver;

    @BeforeMethod
    public void setup() {
        driver = new ChromeDriver();
        driver.get("https://example.com");
    }

    @Test
    public void testFailureScreenshot() {
        // Intentionally failing test
        driver.findElement(By.id("wrongElement")).click();
    }

    @AfterMethod
    public void takeScreenshotOnFailure(ITestResult result) throws IOException {
        if (ITestResult.FAILURE == result.getStatus()) {
            File src = ((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE);
            FileUtils.copyFile(src, new File("failed_test_screenshot.png"));
        }
        driver.quit();
    }
}

πŸ”Ή Key Benefits:
✔️ Automatically captures a screenshot when a test fails
✔️ Saves debugging time
✔️ Useful for generating reports


πŸ† Best Practices for Taking Screenshots

✔️ Always use try-catch to handle exceptions
✔️ Store screenshots with timestamps to avoid overwriting
✔️ Use meaningful names for screenshots (e.g., Login_Failure.png)
✔️ Ensure WebDriver waits for elements before capturing


πŸ“Œ Conclusion

Taking screenshots in Selenium WebDriver is an essential technique for debugging and reporting. Whether capturing the full page, specific elements, or handling failures, you can use built-in and third-party tools like Ashot for enhanced functionality. πŸš€ Happy Testing! 🎯