I want the screenshot of only a specific element and not the entire page. Is it possible with Selenium Webdriver?

0 votes
I'm using Selenium WebDriver and I'm only able to get the screenshot of the whole page. But, I want only a part of the page and just a specific element in particular. Is there any way to capture a screenshot by selected item or element?
Apr 30, 2018 in Selenium by kappa3010
• 2,020 points
3,546 views

2 answers to this question.

0 votes

There is no in-built function for taking partial screenshot. But, there is a work around. After taking the entire screenshot, we can crop that screenshot to our requirements. Check the below code. I've done it that way.

driver.get("http://www.google.com");
WebElement element = driver.findElement(By.id("hplogo"));

// Get entire page screenshot
File screenshot = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
BufferedImage  fullImg = ImageIO.read(screenshot);

// Get the location of element on the page
Point point = element.getLocation();

// Get width and height of the element
int eleWidth = element.getSize().getWidth();
int eleHeight = element.getSize().getHeight();

// Crop the entire page screenshot to get only element screenshot
BufferedImage eleScreenshot= fullImg.getSubimage(point.getX(), point.getY(),
    eleWidth, eleHeight);
ImageIO.write(eleScreenshot, "png", screenshot);

// Copy the element screenshot to disk
File screenshotLocation = new File("C:\\images\\GoogleLogo_screenshot.png");
FileUtils.copyFile(screenshot, screenshotLocation);
answered Apr 30, 2018 by king_kenny
• 3,610 points
can you please help me in cropping ".//img[@class = 'captcha'] in the https://resident.uidai.gov.in/offlineaadhaar, please my contact mail id chvijay.1990@gmail.com
Hey @Vijay. I can not open the link you mentioned. It says "Access Denied"
0 votes

Hey @kappa3010, you can try this. Though there was a raster exception but if you ignore that, it works fine.

Here is the code that I used.

import java.awt.image.BufferedImage;
import java.awt.image.RasterFormatException;
import java.io.EOFException;
import java.io.File;
import java.io.IOException;
import javax.imageio.ImageIO;
import org.openqa.selenium.By;
import org.openqa.selenium.OutputType;
import org.openqa.selenium.Point;
import org.openqa.selenium.TakesScreenshot;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
public class ScreenshotParticular 
{
    public static void main(String[] args) throws IOException, InterruptedException 
    {
        System.setProperty("webdriver.chrome.driver","C:\\Users\\priyj_kumar\\Downloads\\chromedriver.exe");
        WebDriver driver = new ChromeDriver();
        driver.manage().window().maximize();
        driver.get("https://www.pexels.com/search/Joker/");
        WebElement element1 = driver.findElement(By.xpath("/html/body/div[1]/div[3]/div[3]/div/div[1]/article/a[1]/img"));
        element1.click();
        Thread.sleep(4000);
        WebElement element = driver.findElement(By.xpath("/html/body/div[4]/div/div/section[1]"));
        File screenshot = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);
        BufferedImage fullimg = ImageIO.read(screenshot);  
        Point point = element.getLocation();
        int elewidth = element.getSize().getWidth();
        int eleheight = element.getSize().getHeight();
        try{
            BufferedImage elementScreenshot = fullimg.getSubimage(point.getX(), point.getY(), elewidth, eleheight);
            ImageIO.write(elementScreenshot, "png", screenshot);
        }
        catch(RasterFormatException ignoRasterFormatException)
       {
            System.out.println("Ignore Exception");
       }
       org.apache.commons.io.FileUtils.copyFile(screenshot, new File("C:\\Users\\priyj_kumar\\Downloads\\screenshot.png"));
       Thread.sleep(4000);
       driver.close();
   }
}

Hope this helps.

answered Dec 31, 2018 by Priyaj
• 56,200 points
What hep does ignoring the Raster exception do? Can you explain your code plz?

Hey @Vardhan, by keeping the 

BufferedImage elementScreenshot = fullimg.getSubimage(point.getX(), point.getY(), elewidth, eleheight);
            ImageIO.write(elementScreenshot, "png", screenshot);

Using try-catch block I got to overcome the RasterFormatException. Even though there was an exception not much was effected on the output. I got a correct output and would imply for the question also.

Talking about the code:

I took a complete screenshot of the webpage and then cropped it to a particular section or the element I needed. As you can see, I took the x and y coordinates and then using get.Subimage method I cropped the part in which the element is present. This way I got the screenshot modifed and created a file with .png extension. Please let me know if you have any further question on this?

Related Questions In Selenium

0 votes
1 answer
0 votes
1 answer

What is Xpath and what are the types of it in Selenium Webdriver?

Hi Piyush, XPath is defined as XML path. It is ...READ MORE

answered May 8 in Selenium by Pratibha
• 2,760 points
102 views
0 votes
1 answer

Finding WebDriver element with Class Name in java

The better way to handle this element ...READ MORE

answered Apr 10, 2018 in Selenium by nsv999
• 5,050 points
402 views
0 votes
1 answer
0 votes
1 answer

Geo-location microphone camera pop up

To Allow or Block the notification, access using Selenium and you have to ...READ MORE

answered May 11, 2018 in Selenium by Samarpit
• 5,130 points
756 views
0 votes
1 answer

How to use such xpath to find web elements

It's much simpler to use: #MyDiv123 > div.super or ...READ MORE

answered Jun 14, 2018 in Selenium by Samarpit
• 5,130 points
400 views
0 votes
1 answer

Is it possible to manually set the attribute value of a Web Element using Selenium?

Yes, its very much possible. You just ...READ MORE

answered May 8, 2018 in Selenium by king_kenny
• 3,610 points
4,934 views
0 votes
1 answer