How to send texts and get texts using JavascriptExecutor?

Recently, I got to know two situations which were faced by two of my colleagues. One colleague was facing difficulty to send texts to the text area in Mozilla Firefox and my another colleague had a problem in retrieving text whatever text she sent by WebDriver’s sendkeys() method to the text box in Chrome browser. They reached to me for seeking help and discussion over the issues. After my analysis I suggested them to use JavascriptExecutor and it really worked.

So today this tutorial is written based on the suggestions which I gave to my colleagues to troubleshoot the scenarios of sending texts to the text area and retrieving text from the text box.

Note: This tutorial is not restricted to same situations only as discussed above. She found issues in retrieving texts from the text box because she had that scenario. You can use this to retrieve text from any of the elements.

Before we jump to the today’s topic, let me suggest you some awesome tutorials for you to add another milestone of the Selenium knowledge in your learning journey:

• How to handle checkbox and radio button using JavascriptExecutor?
• How to handle checkbox and radio button in Selenium?
• Actions class in Selenium to handle Keyboard and Mouse events
• Disable developer mode extensions warning using Selenium
• Launch Chrome browser in Selenium
• Launch Mozilla browser in Selenium
• How to verify the title of the web page?

Once you finish these suggested tutorials then you feel confident enough to tackle some of the typical problems in Selenium.

Well, let’s start with handling sending text data to the text area using JavascriptExecutor in Selenium WebDriver. So here we go!

How to send texts without using sendKeys() method in Selenium WebDriver?

This technique is the alternative way to sendKeys(). If you are trying to send texts using JavascriptExecutor then I can figure out there could be three reasons for doing this act, which is as follows:

• First reason, I have already discussed above my colleague’s roadblock
• That text is element might be locked or disabled
• sendKeys() sends texts in a sequence of characters and that may take bit longer time if you have to send a huge number of characters, let’s say 5000 characters. So in that case, it will be time taking. Therefore, you can use JavaScript technique to send entire 5000 characters all at once to the text box.

Let’s begin with command number one.

Command# 1

Here is the sample code of command one to send texts using JavascriptExecutor.

JavascriptExecutor js = (JavascriptExecutor)driver;

js.executeScript(“document.getElementsById(‘some_id’).value=’Avinash Mishra’;”);

Here is the entire program:

package SeleniumTester;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class JavaScriptRandomDemo {
  @Test
  public void javaScriptRandomDemo()throws InterruptedException {
	  
	  System.setProperty("webdriver.chrome.driver", "C:\\Selenium\\chromedriver.exe");
	  
	  WebDriver driver = new ChromeDriver();
	 
	  driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
	  
	  driver.get("https://www.inviul.com");
	  
	  driver.manage().window().maximize();
	  Thread.sleep(3000);
	  
	  //Javascript command
	  JavascriptExecutor js = (JavascriptExecutor)driver;
	  js.executeScript("document.getElementById('s').value='Avinash Mishra';");
	  	  
	  Thread.sleep(5000);
	  
	  driver.close();
	  
	  driver.quit();


  }
}

Explanations:

This program first opens the https://www.inviul.com and find the search box. It sends text ‘Avinash Mishra’ in the search box. Further, search box shows all the results related to Avinash Mishra.

Command# 2

This is another technique to send texts using JavascriptExecutor in Selenium WebDriver. Here is the sample code:

WebElement webl = driver.findElement(By.xpath(“xpath_expression”));

JavascriptExecutor js = (JavascriptExecutor)driver;

js.executeScript(“arguments[0].value=’Avinash Mishra’;”, webl);

Here is the full program which uses the above command:

package SeleniumTester;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class JavaScriptRandomDemo {
  @Test
  public void javaScriptRandomDemo()throws InterruptedException {
	  
	  System.setProperty("webdriver.chrome.driver", "C:\\Selenium\\chromedriver.exe");
	  
	  WebDriver driver = new ChromeDriver();
	 
	  driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
	  
	  driver.get("https://www.inviul.com");
	  
	  driver.manage().window().maximize();
	  Thread.sleep(3000);
	  
	  WebElement webl = driver.findElement(By.id("s"));
	  
	  //Javascript command
	  JavascriptExecutor js = (JavascriptExecutor)driver;
	  js.executeScript("arguments[0].value='Avinash Mishra';", webl);
	  	  
	  Thread.sleep(5000);
	  
	  driver.close();
	  
	  driver.quit();


  }
}

How to retrieve texts using JavascriptExecutor in Selenium WebDriver?

The technique which we are going to discuss will retrieve the texts of any web elements by using JavascriptExecutor in Selenium Webdriver. Here we will discuss the two commands; you can use any of them based on its usability.

Command# 1

JavascriptExecutor js = (JavascriptExecutor)driver;

String text = js.executeScript(“return document.getElementById(‘some_id’).innerHTML”).toString();

The entire program will be-

package SeleniumTester;

import java.util.concurrent.TimeUnit;

import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;

public class JavaScriptRandomDemo {
  @Test
  public void javaScriptRandomDemo()throws InterruptedException {
	  
	  System.setProperty("webdriver.chrome.driver", "C:\\Selenium\\chromedriver.exe");
	  
	  WebDriver driver = new ChromeDriver();
	 
	  driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
	  
	  driver.get("https://www.inviul.com");
	  
	  driver.manage().window().maximize();
	  Thread.sleep(3000);
	  
	  //Javascript command
	  JavascriptExecutor js = (JavascriptExecutor)driver;
	  String text = js.executeScript("return document.getElementById('main').innerHTML").toString();
	  System.out.println("Text on hompage is- "+text );
	  	  
	  Thread.sleep(5000);
	  
	  driver.close();
	  
	  driver.quit();


  }
}

Explanations:

This program is opening the homepage of Inviul and looking for the Latest Articles texts on the entire homepage. Once found, it is retrieving the text for the web element.

Command# 2

WebElement webl = driver.findElement(By.xpath(“xpath_expression”));

JavascriptExecutor js = (JavascriptExecutor)driver;

String text = (String) js.executeScript(“return arguments[0].text;”, webl);

This command will only work when there is direct text in the element.

Hope this tutorial helped you. If you still have any confusions please write in the comment below.

Happy Learning. 🙂