如何在 http://jqueryui.com 中为 RadioButton 场景使用相对 Xpath 定位元素答案

【问题标题】：How to locate the element using Relative Xpath for RadioButton Scenario within http://jqueryui.com如何在 http://jqueryui.com 中为 RadioButton 场景使用相对 Xpath 定位元素
【发布时间】：2019-03-11 22:07:45
【问题描述】：

我正在尝试通过网站自动化 Selenium 中的 RadioButton 场景 - http://jqueryui.com/checkboxradio/

我尝试使用 CssSelector 的 xpath，自定义 xpath，但对我没有任何效果。我最终不得不使用绝对 xpath（虽然不是最佳实践）才能使代码正常工作。

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();
            }
        }

    }
}

【问题讨论】：

标签： java selenium xpath webdriver webdriverwait

【解决方案1】：

如果我正确解释了您不想使用完整 xPath 的问题，我发现以下内容将识别您抓取的相同单选元素：

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

然后找到随后的复选框（“纽约”之后的两个），您可以使用

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

和

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

【讨论】：

【解决方案2】：

单选按钮是一个 input 元素，具有 radio 类型，与它进行交互的方法很简单。为此，您可以使用 id radio-1。

如果您想通过标签文本定位单选按钮，例如“纽约”，您可以使用下面的 xpath：

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

代码将是：

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);

您也可以使用label 元素来选择使用//label[normalize-space(.)='New York']，但isSelected() 将不起作用，您必须检查ui-state-active css 类的可用性：

// 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");

【讨论】：

【解决方案3】：

试试下面的代码。我认为 webdriver click 不起作用。所以我使用了 javascript 执行器来点击元素。

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();
            }
        }

输出：

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

【讨论】：

【解决方案4】：

如果您尝试选择 New York 单选按钮，您可以使用以下 xpath。

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

【讨论】：

【解决方案5】：

要单击文本 New York 旁边的 单选按钮，您需要为 elementToBeClickable() 诱导 WebDriverWait，您可以使用以下解决方案：

代码块：

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");
    }
}

控制台输出：
```
Clicking of CheckBox Completed
```
浏览器快照：

【讨论】：