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
5,796 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,650 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"
It is perfect! :)
Thanks @Seb. Glad you issue get resolved.
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,960 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?

After having taken and saved the screenshot all the other selenium commands don't work as if the IDE had switched outside of the WebDriver and couldn't go back to execute tasks on the WebDriver.

What can I do?
Hey Luca, can you show which commands you are using or your code snippet?

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
• 3,680 points
243 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,110 points
1,108 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,150 points
1,232 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,150 points
978 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,650 points
7,420 views
0 votes
1 answer