Handling JavaScript in Selenium

JavaScript is a scripting language that runs on client side, i.e, on the browser.

We can execute JavaScript code through Selenium WebDriver using the methods available from the WebDriver class. This is useful when we cannot perform certain operations using the Selenium WebDriver API or we want to test the JavaScript code. Selenium supports javaScriptExecutor and no need for an extra plugin or add-on.

How Do We Use JavaScript in WebDriver?

Python Selenium WebDriver provides a built-in method: 

driver.execute_script("some javascript code here")

below are the few examples using javasciptexecutor. 

Scenario 1:

 Generate Alert window using JavaScriptExecutor. 

Script:

from selenium import webdriver
chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)
driver.get("http://newtours.demoaut.com") 

driver.execute_script('alert("Hello World")')

Note: When the above code is executed successfully. You will observe

Alert window will be displayed.

Scenario 2:

 Get the Page Title using JavaScriptExecutor.

Script:

from selenium import webdriver

chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)
driver.get("http://newtours.demoaut.com") 

pageTitle=driver.execute_script('return document.title')
print(pageTitle)

Scenario 3:

 Get the URL of the Page using JavaScriptExecutor.

Script:

from selenium import webdriver

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

driver.get("http://newtours.demoaut.com")

pageURL=driver.execute_script(‘return document.URL‘)
print(pageURL)

Scenario 4:

 Get the Domain of the URL using JavaScriptExecutor.

Script:

from selenium import webdriver

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

driver.get("http://newtours.demoaut.com")

pageDomain=driver.execute_script(‘return document.domain‘)
print(pageDomain)

Scenario 5:

 Get the InnerText of the page using JavaScriptExecutor.

Script:

from selenium import webdriver

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

driver.get("http://newtours.demoaut.com")

pageinnerTxt=driver.execute_script(‘return document.documentElement.innerText‘)
print(pageinnerTxt)

Scenario 6:

 Refresh the Page, Backwards  and forward of the page using javaScriptExecutor.

Script:

from selenium import webdriver

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

driver.get("http://newtours.demoaut.com")

# Refresh the Page

driver.execute_script('history.go(0)')

# Clicking the Backward button
driver.execute_script('window.history.back()')
pageTile=driver.execute_script('return document.title')
print("Backward Page Title is ",pageTile)
#Clicking the forward button.

driver.execute_script('window.history.forward()')
pageTile=driver.execute_script('return document.title')
print("Forward Page Title is ",pageTile)

Scenario 7:

 Click on the Button/Link using javaScriptExecutor.

Script:

from selenium import webdriver

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

driver.get("http://newtours.demoaut.com") 

oginEle=driver.find_element_by_xpath("//input[@type='image' and @name='login']")

# click on the login button
driver.execute_script('arguments[0].click()',loginEle)
pageTile=driver.execute_script('return document.title')
print("Page Title is ",pageTile)

Scenario 8:

Enter text in text fields using javaScriptExecutor.

Script:

from selenium import webdriver

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

driver.get("http://newtours.demoaut.com")

txtobj=driver.find_element_by_xpath("//input[@name='userName']")
pwdobj=driver.find_element_by_xpath("//input[@name='password']")

driver.execute_script("arguments[0].value='hello'",txtobj)
driver.execute_script("arguments[0].value='hello'",pwdobj) 

oginEle=driver.find_element_by_xpath("//input[@type='image' and @name='login']")

# click on the login button
driver.execute_script('arguments[0].click()',loginEle)
pageTile=driver.execute_script('return document.title')
print("Page Title is ",pageTile)

Scenario 9:

Enter text in text fields using getElementByID instead arguments[0] using javaScriptExecutor.

Script:

from selenium import webdriver

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

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

loginele=driver.find_element_by_xpath("//input[@value='Log In' and @type='submit']")
driver.execute_script("document.getElementById('email').value='hello'")
driver.execute_script("document.getElementById('pass').value='hello'")
driver.execute_script("arguments[0].click()",loginele) 

pageTile=driver.execute_script('return document.title')
print("Page Title is ",pageTile)

Scenario 10:

Hide and Show an Element using javaScriptExecutor.

Script:

from selenium import webdriver

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

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

loginele=driver.find_element_by_xpath("//input[@value='Log In' and @type='submit']")

driver.execute_script("arguments[0].style.display='none'",loginele)
time.sleep(1)
driver.execute_script("arguments[0].style.display='block'",loginele)

Note: When the above code is executed successfully. You will observe that loginbutton will be disappeared and appeared.

Scenario 11:

Highlight an Element using javaScriptExecutor.

Script:

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

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

loginele=driver.find_element_by_xpath("//input[@value='Log In' and @type='submit']")

driver.execute_script("arguments[0].style.border='1px dotted red'",loginele)

Scenario 12:

Change the Background colour of  an Element using javaScriptExecutor.

Script:

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

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

driver.execute_script("document.getElementById('email').style.background=blue")

ScrollBy() Method:

The scrollBy() method scrolls the document by the specified number of pixels.

Syntax:

window.scrollBy(xnum, ynum)

xnum : How many pixels to scroll by, along the x-axis (horizontal). Positive values will scroll to the right, while negative values will scroll to the left.

ynum : How many pixels to scroll by, along the y-axis (vertical). Positive values will scroll down, while negative values scroll up.

Scenario 13:

Scroll-Down Until an Element Displayed using javaScriptExecutor.

Script:

from selenium import webdriver
chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)
driver.get("https://www.wix.com/")

objele=driver.find_element_by_xpath("//span[text()='Manage and Grow Your Business Online']")
driver.execute_script("arguments[0].scrollIntoView(true)",objele)

Scenario 14:

Scroll-Down and Scroll Up of 4000px vertically using javaScriptExecutor.

Script:

from selenium import webdriver

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

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

driver.execute_script("window.scrollBy(0,3200)")
time.sleep(2)

driver.execute_script("window.scrollBy(0,-3200)")

Scenario 15:

Scroll-Down and Scroll Up of 4000px Horizontally using javaScriptExecutor.

Script:

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

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

driver.execute_script("window.scrollBy(300,0)")
time.sleep(2)
driver.execute_script("window.scrollBy(-300,0)")

Scenario 16:

Scroll-Down at end of the page using javaScriptExecutor.

Script:

from selenium import webdriver

chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)
driver.get("https://www.wix.com/")

driver.execute_script("window.scrollBy(0, document.body.scrollHeight)")

Scenario 17:

Navigate to another Page using javaScriptExecutor.

Script:

from selenium import webdriver
chromePath="C:\\resources\\executables\\chromedriver.exe"
driver=webdriver.Chrome(executable_path=chromePath)
driver.get("https://www.wix.com/")

driver.execute_script("window.location='https://www.wix.com/explore/websites'")