• Selenium Video Tutorials

Selenium WebDriver - Handling Forms

Selenium Webdriver can be used to handle forms on a web page. In HTML terminology, a form element is identified by the tagname called form. Also, it should have the feature to submit the form, the element used for form submission should have the tagname called input along with attribute type having the value as submit. It must be noted that a form on a web page may contain text boxes, links, checkboxes, radio buttons, and other web elements that would help the user to input details on a web page.

Let us now discuss the identification of a form element on a web page shown in the below image. First, we would need to right click on the webpage, and then click on the Inspect button in the Chrome browser. Then, the corresponding HTML code for the whole page would be visible. For investigating a single element on a page, we would need to click on the left upward arrow, available to the top of the visible HTML code as highlighted below.

Selenium Handling Forms 1

Once, we had clicked and pointed the arrow to any element inside the form, its HTML code was visible, reflecting the form tagname(enclosed in <>).

Selenium Handling Forms 2

In the above form, we can submit it with details, using the Register button. Once, we had clicked and pointed the arrow to the Register button inside the form, its HTML code was visible, reflecting the input tagname(enclosed in <>), and its type attribute having the value submit.

Selenium Handling Forms 3 
<input type="submit" class="btn btn-primary" value="Register">

We can submit a form with the help of the methods - submit() and click(). The basic difference between a normal button and submit button is that, a normal button can be interacted only with the click() method but the submit button can be interacted with both click() and submit method.

Syntax

Syntax with submit method −

WebDriver driver = new ChromeDriver();

// identify input box 1
WebElement inputBx = driver.findElement
   (By.xpath("<value of xpath>"));
inputBx.sendKeys("Selenium");

// submit form
WebElement btn = driver.findElement
   (By.xpath("<value of xpath>"));
btn.submit();

Syntax with click method −

WebDriver driver = new ChromeDriver();

// identify input box 1
WebElement inputBx = driver.findElement
   (By.xpath("<value of xpath>"));
inputBx.sendKeys("Selenium");

// submit form
WebElement btn = driver.findElement
   (By.xpath("<value of xpath>"));
btn.click();

Also, the normal button has the input tagname(enclosed in <>), and its type attribute should be the value button.

In the below page, let us see the HTML code of the Click Me button on a web page.

Selenium Handling Forms 4 
<button type="button" class="btn btn-primary" 
   onclick="showDiv()">Click Me</button>

Let us take an example of the form in the below page, which contains the web elements - label, input box, button, password, and so on.

Selenium Handling Forms 5

Syntax

WebDriver driver = new ChromeDriver();

// identify input box 1
WebElement inputBx = driver.findElement
   (By.xpath("<value of xpath>"));
inputBx.sendKeys("Selenium");

// get value entered
System.out.println("Value entered in FirstName: " + inputBx.getAttribute("value"));

// identify input box 2
WebElement inputBx2 = driver.findElement
   (By.xpath("<value of xpath>"));
inputBx2.sendKeys("Tutorials");

// get value entered
System.out.println("Value entered in LastName: " + inputBx2.getAttribute("value"));

// identify input box 3
WebElement inputBx3 = driver.findElement
   (By.xpath("<value of xpath>"));
inputBx3.sendKeys("Tutorialspoint");

// identify input box 4
WebElement inputBx4 = driver.findElement
   (By.xpath("<value of xpath>"));
inputBx3.sendKeys("Tutorialspoint");

// submit form
WebElement btn = driver.findElement
   (By.xpath("<value of xpath>"));
btn.submit();

Example

Code Implementation on FormElements.java class file.

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

public class FormElements {
   public static void main(String[] args) {

      // 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 form
      driver.get("https://www.tutorialspoint.com/selenium/practice/register.php");

      // identify input box 1
      WebElement inputBx = driver.findElement(By.xpath("//*[@id='firstname']"));
      inputBx.sendKeys("Selenium");

      // get value entered
      System.out.println("Value entered in FirstName: " + inputBx.getAttribute("value"));

      // identify input box 2
      WebElement inputBx2 = driver.findElement(By.xpath("//*[@id='lastname']"));
      inputBx2.sendKeys("Tutorials");

      // get value entered
      System.out.println("Value entered in LastName: " + inputBx2.getAttribute("value"));

      // identify input box 3
      WebElement inputBx3 = driver.findElement(By.xpath("//*[@id='username']"));
      inputBx3.sendKeys("Tutorialspoint");

      // get value entered
      System.out.println("Value entered in UserName: " + inputBx3.getAttribute("value"));
      
      // identify input box 4
      WebElement inputBx4 = driver.findElement(By.xpath("//*[@id='password']"));
      inputBx3.sendKeys("Tutorialspoint");

      // submit form
      WebElement btn = driver.findElement(By.xpath("//*[@id='signupForm']/div[5]/input"));
      btn.submit();

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

Output

Value entered in FirstName: Selenium
Value entered in LastName: Tutorials
Value entered in UserName: Tutorialspoint

Process finished with exit code 0

In the above example, we had filled the form having the input boxes then obtained the value entered(except the password field) with the message in the console - Value entered in FirstName: Selenium, Value entered in LastName: Tutorials, and Value entered in UserName: Tutorialspoint.

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

Let us take another example of the form in the below page, which contains the web elements - label, input box, button, password, and so on.

Selenium Handling Forms 6

Syntax

Syntax with click() method −

WebDriver driver = new ChromeDriver();

// identify input box 1
WebElement inputBx = driver.findElement(By.xpath("<value of xpath>"));
inputBx.sendKeys("Selenium");

// get value entered
System.out.println("Value entered in FirstName: " + inputBx.getAttribute("value"));

// identify input box 2
WebElement inputBx2 = driver.findElement(By.xpath("<value of xpath>"));
inputBx2.sendKeys("Selenium");

// submit form
WebElement btn = driver.findElement(By.xpath("<value of xpath>"));
btn.click();

Example

Code Implementation on FormElement.java class file.

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

public class FormElement {
   public static void main(String[] args) {

      // 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 form
      driver.get("https://www.tutorialspoint.com/selenium/practice/login.php");

      // identify input box 1
      WebElement inputBx = driver.findElement(By.xpath("//*[@id='email']"));
      inputBx.sendKeys("Selenium");

      // get value entered
      System.out.println("Value entered in Email: " + inputBx.getAttribute("value"));

      // identify input box 2
      WebElement inputBx2 = driver.findElement(By.xpath("//*[@id='password']"));
      inputBx2.sendKeys("Tutorials");

      // submit form
      WebElement btn = driver.findElement(By.xpath("//*[@id='signInForm']/div[3]/input"));
      btn.click();

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

Output

Value entered in Email: Selenium

Process finished with exit code 0

In the above example, we had filled out the form having the input boxes then obtained the value entered(except the password field) with the message in the console - Value entered in Email: Selenium.

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

Thus, in this tutorial, we had discussed how to handle forms using the Selenium Webdriver.

Advertisements