Selenium WebDriver - Input Boxes

Quiz

Selenium Webdriver can be used to handle input boxes (also referred to as a text box). In HTML terminology, every input box is identified by the tagname called input.

Identification of Input Boxes in HTML

Open any browser, say Chrome, right click on the web page, and then click on the Inspect button. Then, the complete HTML code for the page would appear. For inspecting an input box on a page, click on the left upward arrow, available to the top of the HTML code as highlighted in the below image.

Once we had clicked and pointed the arrow to the input box (highlighted in the below image), its HTML code was visible, reflecting the input tagname (enclosed in <>).

Example 1- Input Text with sendKeys

Let us take an example of the above page, where we would first enter some text in the input box using the sendKeys() method. Then, we wipe out the text entered with the clear() method.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.edge.EdgeDriver;
import java.util.concurrent.TimeUnit;

public class EnterText{
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new EdgeDriver();

      // adding implicit wait of 10 secs
      driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

      // Opening the webpage 
      driver.get("https://www.tutorialspoint.com/selenium/practice/text-box.php");

      // Identify the input box 
      WebElement elm = driver.findElement(By.xpath("//*[@id='fullname']"));

      // enter text 
      elm.sendKeys("Java");

      // Get the value
      String txt = driver.findElement(By.xpath("//*[@id='fullname']")).getAttribute("value");
      System.out.println("Entered text: " + text);

      // clear the text entered
      elm.clear();

      // Get no text 
      String txt1 = driver.
      findElement(By.xpath("//*[@id='fullname']")).getAttribute("value");
      System.out.println("Get text after clearing: " + txt1);

      // Closing browser
      driver.quit();
   }
}

Output

Entered text: Java
Get text after clearing: 

Process finished with exit code 0

In the above example, we had first entered the text Java in the edit box, and also obtained the value entered in the console with the message - Entered text: Java. Then cleared the value entered and got no value in the edit box after removing the text and received the message in the console: Get text after clearing:.

Finally, the message Process finished with exit code 0 was received, signifying successful execution of the code.

Example 2 - Input Text with Actions Class

We can also use the sendKeys() method along with the Actions Class in Selenium. We would take the same example discussed above and see the implementation.

package org.example;

import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.interactions.Actions;
import java.util.concurrent.TimeUnit;

public class HandlingInputBoxWithActions {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage where we will identify edit box to enter        driver.get("https://www.tutorialspoint.com/selenium/practice/text-box.php");

      // Identify the input box with xpath locator
      WebElement e = driver.findElement(By.xpath("//*[@id='fullname']"));

      // enter text in input box using Actions class
      Actions action = new Actions(driver);
      action.sendKeys(e, "SeleniumS").perform();

      // Get the value entered
      String text = driver.
      findElement(By.xpath("//*[@id='fullname']")).getAttribute("value");
      System.out.println("Entered text with Actions class is: " + text);

      // clear the text entered
      e.clear();

      // Get no text after clearing text
      String text1 = driver.
      findElement(By.xpath("//*[@id='fullname']")).getAttribute("value");
      System.out.println("Get text after clearing: " + text1);

      // Closing browser
      driver.quit();
   }
}

Output

Entered text with Actions class is: SeleniumS
Get text after clearing: 

Process finished with exit code 0

In the above example, we had first entered the text SeleniumS in the input box, and also retrieved the value entered in the console with the message- Entered text with Actions class is: SeleniumS. Then cleared the value entered and got no value in the input box after clearing up the text. Hence, we had also received the message in the console: Get text after clearing:.

Example 3 - Input Text with JavaScriptExecutor

We can also use the JavaScriptExecutor to input text in the input box in Selenium. We would take the same example discussed above.

package org.example;

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 java.util.concurrent.TimeUnit;

public class HandlingInputBoxWithJS {
   public static void main(String[] args) throws InterruptedException {

      // Initiate the Webdriver
      WebDriver driver = new ChromeDriver();

      // adding implicit wait of 15 secs
      driver.manage().timeouts().implicitlyWait(15, TimeUnit.SECONDS);

      // Opening the webpage where we will identify edit box to enter
      driver.get("https://www.tutorialspoint.com/selenium/practice/text-box.php");

      // Identify the input box with xpath locator
      WebElement e = driver.findElement(By.xpath("//*[@id='fullname']"));

      // enter text in input box using JavascriptExecutor
      JavascriptExecutor javascriptExecutor = (JavascriptExecutor) driver;
      javascriptExecutor.executeScript("arguments[0].setAttribute('value', 'Selenium Java')", e);

      // Get the value entered
      String text = driver.findElement(By.xpath("//*[@id='fullname']")).getAttribute("value");
      System.out.println("Entered text with JavaScript Executor is: " + text);

      // clear the text entered
      e.clear();

      // Get no text after clearing text
      String text1 = driver.
      findElement(By.xpath("//*[@id='fullname']")).getAttribute("value");
      System.out.println("Get text after clearing: " + text1);

      // Closing browser
      driver.quit();
   }
}

Output

Entered text with JavaScript Executor is: Selenium Java
Get text after clearing: 

Process finished with exit code 0

In the above example, we had first entered the text Selenium Java in the input box, and retrieved the value entered in the console with the message - Entered text with JavaScript Executor is: Selenium Java. Then cleared the value entered and got no value in the input box then received the message in the console: Get text after clearing:.

Conclusion

This concludes our comprehensive take on the tutorial on Selenium Webdriver Input Boxes. Weve started with describing identification of input boxes in HTML, and examples to illustrate how to enter text in an input box using sendKeys method, Actions class, and JavaScript in Selenium Webdriver. This equips you with in-depth knowledge of the Selenium Webdriver Input Boxes. It is wise to keep practicing what youve learned and exploring others relevant to Selenium to deepen your understanding and expand your horizons.

Print Page