Handling Radio Buttons in Selenium

Handling Radio Button in Selenium

Handling Radio Buttons

We all must have interacted with radio buttons, be it in an application form or any social media registration page. Selenium treat radio buttons as rest of the web page elements- WebElement. Radio button is a kind of web element which are created in groups and user can only select a single value from that group.

To understand the concept better, let’s analyze our test web page  http://www.echoecho.com/htmlforms10.htm

Go to the bottom of the web page and there you’ll find a set of radio buttons, as depicted in following figure:

AutomationUtils | Selenium WebDriver

In this test web page Inspect “Milk” radio button.
Handling Radio Button in Selenium
HTML structure reveals the tag, attribute and value of this WebElement. Now similarly  perform inspect element  for “Butter” radio button(WebElement).
Handling Radio Button in Selenium
Inspect radio buttons below “Cheese”.
AutomationUtils | Selenium WebDriver
Thing to notice here is the “name” attribute. For the radio buttons “Water”, “Beer” and “Wine”, name attribute is different than above three radio buttons. We will make use of this unique property to distinguish among various radio button containers and then work with individual radio button within that particular container (for more details, refer the final code of chapter Selenium | Extract All Links In A Webpage). To give clear picture, following is the HTML breakdown for these two radio groups:
AutomationUtils | Selenium WebDriver
We will use driver.findElements(By.name(“nameAttribute”))to restrain our self within one group only, where we want to perform the operation. If we want to click on “Cheese” radio button, we will use “group1” name attribute.

Since  driver.findElements(By.name(“nameAttribute”)) will return a List of WebElements, we will store the output of above command in List<WebElements>.

List<WebElement> radioBtns = driver.findElements(By.name("group1"));

Operations on Radio Buttons

In above code, we have created a reference radioBtns to denote all the radio buttons present within “group1” container. We can make use of this reference to interact with respective radio buttons using following selenium methods:

get value of radio button using index

In our example, we have 3 radio buttons in “group1” – Milk, Butter, Cheese. The index value for these radio buttons are 0,1 and 2 respectively. We will use get(index) method of selenium where index 0 will denote “Milk”, 1 will denote “Butter” and so on.

To get the value at particular index, we will use getAttribute(“value”) which will fetch the value of selected index.

        //Create a reference variable for radio button in a particular container
        List<WebElement> radioBtns = driver.findElements(By.name("group1"));
        //print the value of first radio button
        System.out.println(radioBtns.get(0).getAttribute("value"));

Selecting desired radio button

       //Create a reference variable for radio button in a particular container
        List<WebElement> radioBtns = driver.findElements(By.name("group1"));
        //Click on first radio button
       radioBtns.get(0).click();

Verifying if a radio button is already checked

Inspect the radio button which is already checked and verify “checked” text (attribute). A radio button is checked if it has “checked” attribute.

AutomationUtils | Selenium WebDriver

Following code should return a non-null value if radio button is already selected, else it will return null.

       //Create a reference variable for radio button in a particular container
        List<WebElement> radioBtns = driver.findElements(By.name("group1"));
        //verify if "checked" attribute is present in Milk
        if(radioBtns.get(0).getAttribute("checked") != null) {
            System.out.println("Checked");
        }else {
            System.out.println("Not Checked");
        }

Lab Exercise:

Write selenium script to perform following test:

  1. Navigate to AUT http://www.echoecho.com/htmlforms10.htm
  2. Verify if “Cheese” radio button is selected.
  3. If “Cheese” is not selected, select it.

NOTE: For initial code(getUrl() method), refer to Lab Exercise of chapter Navigating Between Windows using Selenium

package test;

import java.util.List;

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.chrome.ChromeOptions;

public class RadioBtn {

    public WebDriver driver;
    //Create a flag variable with initial value as "false". This will help us in verifying if radio button is checked
    boolean flag = false;
    public static void main(String[] args) {
        RadioBtn rdBtn = new RadioBtn();
        rdBtn.getUrl();
        rdBtn.radioTest();

    }
    public void getUrl() {
        System.setProperty("webdriver.chrome.driver", "/home/dj/Downloads/chromedriver/chromedriver");
        ChromeOptions options = new ChromeOptions();
        options.addArguments("start-maximized"); // open Browser in maximized mode
        options.addArguments("disable-infobars"); // disabling infobars
        options.addArguments("--disable-extensions"); // disabling extensions
        options.addArguments("--disable-gpu"); // applicable to windows os only
        options.addArguments("--disable-dev-shm-usage"); // overcome limited resource problems
        options.addArguments("--no-sandbox"); // Bypass OS security model
        driver = new ChromeDriver(options);
        driver.get("http://www.echoecho.com/htmlforms10.htm");

    }
    
    public void radioTest() {
        //Create a reference variable for radio button in a particular container
        List<WebElement> radioBtns = driver.findElements(By.name("group1"));

        //verify if "checked" attribute is present for Cheese
        if(radioBtns.get(2).getAttribute("checked") == null) {
            
            //click on the radio button to select it
            radioBtns.get(2).click();
            
            //set the flag to true to indicate the radio button is now selected
            flag = true;
        }
        if(flag == true) {
            System.out.println("Radio button 'Cheese' is selected");
        }
    }

}

Implement above logic to other web sites and let me know in comments if you face any challenge or have any query.

Author: Dhawal Joshi

A post-graduate in MCA, ISTQB & ITIL certified QA with more than 8 years of experience in QA working with a CMMI Level 5 organization as System Analyst. I started my automation journey with HP UFT(formerly known as QTP) and for the past few years, I am using Selenium for automation. I also have experience in Android Application Development, Java, HTML, and VBScript. When I am not working, I like to spend time with my family, cooking and learning new developments in IT.

1 thought on “Handling Radio Buttons in Selenium

Leave a Reply

Your email address will not be published. Required fields are marked *