Dealing with forms in Selenium Webdriver

Tweet
Share
Share3
3 Shares

Dealing with forms

As you know from this post using a separate class for each web page element is a good practice. Working with forms I recommend you to follow this practice too. Let’s take a look how can you interact with web forms with Selenium Webdriver.

Creating the form class

The web form class should contain this properties:

  • form – for storing form WebElement object. It’s useful to have easy access to the form object.
  • submitButton – for storing submit button WebElement object. It’s useful too.
  • driver – for storing WebDriver object.

Check out the example below:

public class Form
{
    protected WebElement form;
    protected WebElement submitButton;
    protected WebDriver driver;
}
Set text input value

For this purpose I use  WebElement::sendKeys() method:

public void setInputValue(String inputName, String value)
{    
     form.findElement(By.xpath("./descendant::input[@id=\""+inputName+"\"]")).sendKeys(value);
}
Clearing the text input

One-line method using WebElement::clear() method:

public void clearFieldById(String id)
{
    form.findElement(By.xpath("./descendant::input[@id=\""+id+"\"]")).clear();
}
Toggling checkbox
public void toggleCheckbox(String inputName)
{
    form.findElement(By.xpath("./descendant::input[@id=\""+inputName+"\"]")).click();
}
Changing dropdown select value

Setting select value by index, e.g. “Set the select’s option no. 2”

public void setSelectValue(String inputName, Integer index)
{
    Select dropdown = new Select(form.findElement(By.xpath("./descendant::select[@id=\""+inputName+"\"]")));
    dropdown.selectByIndex(index);
}

Setting select value by value, e.g. “Set the select’s option with value ‘someval’ ”

public void setSelectValueByValue(String inputName, String value)
{
    Select dropdown = new Select(form.findElement(By.xpath("./descendant::select[@id=\""+inputName+"\"]")));
    dropdown.selectByValue(value);
}
Uploading files

The most tricky task in this article. There is no comprehensive way how to upload files with forms in any browser. Since I use Chrome Driver I’ll share you how doing that for the Chrome browser. The main idea is in passing the full path to a file in the upload method, copy it to clipboard, open file upload dialog window, paste the path there an click on upload button.

Include AWT package in the form class:

import java.awt.AWTException;
import java.awt.Robot;
import java.awt.Toolkit;
import java.awt.datatransfer.StringSelection;
import java.awt.event.KeyEvent;

Add upload method:

public void uploadFile(String path)
    throws AWTException
{
    setClipboard(path);
    form.findElement(By.xpath("./descendant::input[@type=\"file\"]")).click();

    Robot robot = new Robot();
    // Ctrl-V + Enter on Win
    robot.delay(3000);
    robot.keyPress(KeyEvent.VK_CONTROL);
    robot.keyPress(KeyEvent.VK_V);
    robot.keyRelease(KeyEvent.VK_V);
    robot.keyRelease(KeyEvent.VK_CONTROL);
    robot.keyPress(KeyEvent.VK_ENTER);

}

public static void setClipboard(String str) {
   StringSelection ss = new StringSelection(str);
   Toolkit.getDefaultToolkit().getSystemClipboard().setContents(ss, null);
}

Check the example:

try
{
  getPage().getForm().uploadFile(csvFilePath);
}
catch (AWTException e)
{
  //Upload failed
}
Submitting the form
public void submit(){
   submitButton.click();
}

 

Related Posts