How to take Screen Shots in Selenium Webdriver

Screenshots are desirable for bug analysis. Selenium can automatically take screenshots during execution. It helps us to debug and identify the problem by seeing the screen shot.

Some of the scenarios we may need to capture screenshot using Selenium WebDriver.

1. Application issues

2. Difficulty/timeout to find Web elements on the web page.

WebDriver offers total three APIs to take screenshot of a web page.

1)   save_screenshot(‘filename’)

2)   get_screenshot_as_file(‘filename’)

3)   get_screenshot_as_png()

Examples

save_screenshot()

from selenium import webdriver

chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)

driver.get("http://newtours.demoaut.com") driver.find_element_by_xpath("//a[text()='Hotels']").click()
driver.save_screenshot("C:\\Ddrive\\SelScreenShots\hotels.png")

get_screenshot_as_file()

from selenium import webdriver
chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)

driver.get("http://newtours.demoaut.com") driver.find_element_by_xpath("//a[text()='Hotels']").click()
driver.get_screenshot_as_file("C:\\Ddrive\\SelScreenShots\HotelsPage.png")

Notes:

1.If you use the above code, then it will take the screenshot and will store in C:\\Ddrive\\SelScreenShots and screenshot name will be hotels.png.

If you are not provided any path for saving it will store where your scripts are saving.

Ex1: driver.save_screenshot("hotelsPage.png")

Ex2: driver.get_screenshot_as_file("HotelsPage.png")

2. To store screenshots is that save_screenshot(‘filename’) and get_screenshot_as_file(‘filename’) will work when extension of file is ‘.png’

Else Python throws a warning message.

C:\PycharmProjects\notesexps\venv\lib\site-packages\selenium\webdriver\remote\webdriver.py:1031: UserWarning: name used for saved screenshot does not match file type. It should end with a `.png` extension "type. It should end with a `.png` extension", UserWarning)

Ex1: driver.save_screenshot("hotelsPage.jpeg")

Ex2: driver.get_screenshot_as_file("HotelsPage.jpeg")

get_screenshot_as_png()

it returns a binary data. This binary data will create an image in memory and can be useful if we want to manipulate before saving it.

Scenario :

I want to take screen shot of only “Sign Up “ button in Facebook login page.

from selenium import webdriver

from io import BytesIO
from PIL import Image

chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)

driver.get("https://www.facebook.com/")
signupele=driver.find_element_by_xpath("//button[@name='websubmit' and text()='Sign Up']")
location=signupele.location
size=signupele.size
screenshot=driver.get_screenshot_as_png()
img=Image.open(BytesIO(screenshot))
left=location['x']
top=location['y']
right=location['x']+size['width']
bottom=location['y']+size['height']
img=img.crop((left,top,right,bottom))
img.save("C:\\Ddrive\\SelScreenShots\\signupbtnscrshot.png")

Here we are taking screenshot, cropping it to a particular size, and storing it a ‘.png’ file named signupbtnscrshot.png.

Note:

You should import BytesIO and Image module/packages  whenever you are using get_screenshot_as_png() for saving sreenshots. 

get_screenshot_as_base64()

 Gets the screenshot of the current window as a base64 encoded string

  which is useful in embedded images in HTML.

from selenium import webdriver

from base64
chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)

driver.get("https://www.facebook.com/") 

FileName="C:\\Ddrive\\SelScreenShots\\sample.png" 

base64_data=driver.get_screenshot_as_base64()
screenshotdata=base64.b64decode(base64_data)
screenshot_file=open(filename,"wb")
screenshot_file.write(screenshotdata)
screenshot_file.close()