Chaitanya Maligi
Chaitanya Maligi

Reputation: 215

How to locate the element using Relative Xpath for RadioButton Scenario within http://jqueryui.com

I am trying to automate RadioButton scenario in Selenium through the website - http://jqueryui.com/checkboxradio/

I tried using xpath by CssSelector, customised xpath, but nothing worked for me. I finally had to use absolute xpath(not the best practice though) for the code to work.

public class CheckBoxAndRadioButtons {

    public static void main(String[] args) throws InterruptedException {
        System.setProperty("webdriver.chrome.driver" , "C:/Users/User/Desktop/Selenium Drivers/chromedriver.exe");
        WebDriver driver = new ChromeDriver();
        driver.get("http://jqueryui.com/checkboxradio/");
        driver.manage().window().maximize();

        driver.switchTo().frame(driver.findElement(By.xpath("//iframe[@class='demo-frame']")));
        try {
            Thread.sleep(2000);
        } catch (InterruptedException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
        WebElement radiobox = driver.findElement(By.xpath("/html/body/div/fieldset[1]/label[1]/span[1]"));
        boolean isDisplayedstatus = radiobox.isDisplayed();
        System.out.println(isDisplayedstatus);
        boolean isEnabledstatus = radiobox.isEnabled();
        System.out.println(isEnabledstatus);
        boolean isSelectedstatus = radiobox.isSelected();
        System.out.println(isSelectedstatus);

        Thread.sleep(2000);
        List<WebElement> ele = driver.findElements(By.xpath("//input[@type ='radio']"));
        for(WebElement we:ele) {
            if(!we.isSelected()) {
                we.click();
            }
        }

    }
}

Upvotes: 0

Views: 468

Answers (5)

undetected Selenium
undetected Selenium

Reputation: 193298

To click on the radio button adjacent to the text New York you need to induce WebDriverWait for the elementToBeClickable() and you can use the following solution:

  • Code Block:

    package demo;
    
    import org.openqa.selenium.By;
    import org.openqa.selenium.WebDriver;
    import org.openqa.selenium.chrome.ChromeDriver;
    import org.openqa.selenium.chrome.ChromeOptions;
    import org.openqa.selenium.support.ui.ExpectedConditions;
    import org.openqa.selenium.support.ui.WebDriverWait;
    
    public class Q55111127_Chaitanya_Maligi {
    
        public static void main(String[] args) {
    
            System.setProperty("webdriver.chrome.driver", "C:\\Utility\\BrowserDrivers\\chromedriver.exe");
            ChromeOptions options = new ChromeOptions();
            options.addArguments("start-maximized");
            options.addArguments("--disable-extensions"); 
            WebDriver driver = new ChromeDriver(options);
            driver.get("http://jqueryui.com/checkboxradio/");
            new WebDriverWait(driver, 10).until(ExpectedConditions.frameToBeAvailableAndSwitchToIt(By.xpath("//iframe[@class='demo-frame']")));
            new WebDriverWait(driver, 20).until(ExpectedConditions.elementToBeClickable(By.xpath("//div[@class='widget']//fieldset//label[@for='radio-1']"))).click();
            System.out.println("Clicking of CheckBox Completed");
        }
    }
    
  • Console Output:

    Clicking of CheckBox Completed
    
  • Browser Snapshot:

radio_button_jQuery

Upvotes: 1

KunduK
KunduK

Reputation: 33384

Try this below code.I think webdriver click is not working.So I have used javascript executor to click on element.

WebElement radiobox = driver.findElement(By.xpath("//input[@id='radio-1']"));
        boolean isDisplayedstatus = radiobox.isDisplayed();
        System.out.println(isDisplayedstatus);
        boolean isEnabledstatus = radiobox.isEnabled();
        System.out.println(isEnabledstatus);
        boolean isSelectedstatus = radiobox.isSelected();
        System.out.println(isSelectedstatus);

        List<WebElement> ele = driver.findElements(By.xpath("//input[starts-with(@id, 'radio')]"));
        for(WebElement we:ele) {
            if(!we.isSelected()) {
                JavascriptExecutor executor = (JavascriptExecutor) driver;
                executor.executeScript("arguments[0].click();",we);
                System.out.println("Clicked : " + we.getAttribute("id"));
               // we.click();
            }
        }

Output:

true
true
false
Clicked : radio-1
Clicked : radio-2
Clicked : radio-3

Upvotes: 1

Sers
Sers

Reputation: 12255

Radio button is an input element with radio type and easy way is interact with it. For that you can use id radio-1.

If you want locate radio button by label text, for example "New York", you can use xpath below:

//label[normalize-space(.)='New York']/following-sibling::input[@type='radio'][1]

Code will be:

WebElement radioButton = driver.findElement(By.xpath("//label[normalize-space(.)='New York']/following-sibling::input[@type='radio'][1]");
boolean isDisplayed = radioButton.isDisplayed();
System.out.println(isDisplayed);
boolean isEnabled = radioButton.isEnabled();
System.out.println(isEnabled);
boolean isSelected = radioButton.isSelected();
System.out.println(isSelected);

You also can use label element to select using //label[normalize-space(.)='New York'], but isSelected() will not work and you'll have to check ui-state-active css class availability:

// Using label
WebElement radioButton = driver.findElement(By.xpath("//label[normalize-space(.)='New York']"));

// Select radio by clicking on label
radioButton.click();

// Check if radio selected by css class of the label
boolean selected = radioButton.getAttribute("class").contains("ui-state-active");

Upvotes: 2

C. Peck
C. Peck

Reputation: 3717

If I am correctly interpreting your problem that you don't want to use the full xPath, I found that the following will identify the same radio element you grabbing:

"//fieldset[1]/label[1]/span[1]"

Then to find the subsequent checkboxes (the two after 'New York'), you could use

"//fieldset[1]/label[2]/span[1]"

and

"//fieldset[1]/label[3]/span[1]"

Upvotes: 2

supputuri
supputuri

Reputation: 14145

If you are trying to select New York radio button you can use the following xpath.

//label[contains(@class,'ui-checkboxradio-radio-label') and text()='New York']

Upvotes: 1

Related Questions