Take Screenshot of WebElement in Selenium || New Selenium 4 feature - Naveen AutomationLabs




Take Screenshot of WebElement in Selenium || New Selenium 4 feature



In this blog, I have explained how to take screenshot for a web element in Selenium 4 version. This is the new feature in Selenium 4, earlier we could only take screenshot only for web page, now you can take screenshot for elements and use them with your bug report.



Watch Full video here:



Source Code:




package WM;

import java.io.File;
import java.io.IOException;
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.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;

import io.github.bonigarcia.wdm.WebDriverManager;

public class TakeElementScreenshot {

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

WebDriverManager.chromedriver().setup();
WebDriver driver = new ChromeDriver();
driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);

driver.get("https://app.hubspot.com/login");

WebElement email = driver.findElement(By.id("username"));
WebElement password = driver.findElement(By.id("password"));
WebElement loginButton = driver.findElement(By.id("loginBtn"));
WebElement forgotPwd = driver.findElement(By.linkText("Forgot my password"));

email.sendKeys("naveen@gmail.com");
password.sendKeys("Test@123");
takeElementScreenshot(email, "emailElement");
takeElementScreenshot(password, "passwordElement");
takeElementScreenshot(loginButton, "loginButtonElement");
takeElementScreenshot(forgotPwd, "forgotPwdLink");

driver.quit();

}

//take screenshot using getScreenshotAs() method.

public static void takeElementScreenshot(WebElement element, String fileName) {

File srcFile = element.getScreenshotAs(OutputType.FILE);
try {
FileUtils.copyFile(srcFile, new File("./target/screenshots/" + fileName + ".png"));
} catch (IOException e) {
e.printStackTrace();
}

}

}

Executing Maven Project in windows from Command Prompt:



Executing Maven Project in windows from Command Prompt


Section-I:        
Pre-requisites:
Go to Menu Bar in Eclipse >> Window >> Preferences.     
Check if Maven is integrated with Eclipse or No.
[If you download Eclipse Neon Version, by default Maven will be integrated with Eclipse].

If Maven is integrated with Eclipse then we are good to create Maven Project.                           
If not installed go to Menu Bar >> Help >> Eclipse Market Place and Search by Maven and install required Maven Plugins shown below.










Section II:                                                                                                                                                                                    
 Steps to install Maven Jar Files and Setting Path in Environment Variables: https://maven.apache.org/download.cgi                                                                                                   
Download below highlighted Zip File.                                                                                                                                                      
Once download is completed, unzip it and keep it in any drive in your local system.                                
It is always good practice to keep it in C Drive.

Now we need to set path for Maven in Environment Variables:                                                         
Go to My Computer >> Right Click >> Properties >> Advanced System Settings.                               
 Now Go to Environment Variables and Set Pat as shown below.                                                               
[In my case i have kept Maven Jars in C Drive]                            
                                                                                 

     
Now Add Bin Path of Maven in below Path 
highlighted                                                    
  
C:\Program Files\Maven\apache-maven-3.6.1\bin
                                           
Once Path is set for Maven in Environment Variables.                                                                                              
Go to Command Prompt and type command as shown below to make sure that Maven is installed or not.
                                                                               
                                                                                                                               
If Maven is installed then we will see as highlighted above and now we are good to execute Maven Project. 
Section III:                                                                                                                                                                                           
 Now Executing Maven Project from Command Prompt.                             
                                                                   
To Execute Maven Project from Command Prompt, In pom.xml 
Maven Surefire Plugin must be added.

<build>
<plugins>
                                    <plugin>
                                                      <groupId>org.apache.maven.plugins</groupId>
                                                      <artifactId>maven-surefire-plugin</artifactId>
                                                      <version>2.18.1</version>
                                                      <configuration>
                                                                        <suiteXmlFiles>
                                                                                          <suiteXmlFile>testng_sanity.xml</suiteXmlFile>                                                                                                        </suiteXmlFiles>
                                                      </configuration>
                                    </plugin>
                  </plugins>
</build>

Now Go to Command Promp
Go to Project Folder as shown below

Now Use below commands to execute Maven Project from 
Command Prompt                          
1. mvn clean install : It will execute all test cases as well as it will generate a build. Build will be generated under target folder.                                                                                                                                                                   
2. mvn clean test : It will execute only test cases and it won’t generate build.



This blog is written by Pavan. He is an expert in Selenium Automation and currently working in Infosys as Automation QA Engineer. Also, he is helping QA community with his knowledge along with Naveen AutomationLabs!! 

Cheers!
Naveen AutomationLabs


Payment Details



Naveen AutomationLabs Online Courses:


Payment Options:


Here I'm sharing the bank account details. Please send me the screenshot of the receipt once you make the payment without fail. 

Please send the details at : naveenanimation20@gmail.com
Subject Line: Online Course Payment Receipt - Your Full Name

Please find below bank details: You can make the transaction directly to the given account or make it via Western Union Or Xoom.

Bank Details:
Name : MANALI GUPTA
To Account : 256010100095576
Bank Name : AXIS BANK
City: GUJARAT
Branch Location : PALANPUR, GUJRAT 
IFSC Code: UTIB0000256     

PayPal Payment: 

For Candidates in India:
You can also make the payment via Tez (Google Pay) OR PhonePe :
UPI to this number: +91-9902233400. 
UPI: naveenanimation20@okicici 
OR Google IDnaveenanimation20@gmail.com





Featured Post

How to control Chromedriver using curl

How to control Chromedriver using curl Here is how to use Chromedriver without libraries like  selenium-webdriver . This can be useful ...