# 9 吨 WebDriver – 处理单选按钮和复选框

> 原文： [https://javabeginnerstutorial.com/selenium/9t-webdriver-handling-radio-buttons-checkboxes/](https://javabeginnerstutorial.com/selenium/9t-webdriver-handling-radio-buttons-checkboxes/)

嗨呀超级巨星！ 我知道您现在是[处理文本框和图像](https://javabeginnerstutorial.com/selenium/9s-webdriver-handling-text-boxes-images/)的专家，但是还有很多东西要学习。 让我们成为铁杆！ 让我们了解如何处理单选按钮，复选框，下拉菜单，表格，警报等，但我们一次只能看到一个。 在本文中，我们将专注于处理单选按钮和复选框。 最后，WebDriver 将使您表现出前所未有的表现力。

*准备开始*

**单选按钮**：在一组单选按钮中，一次只能选择一个。 在 HTML 中，它们使用`<input>`标签表示，并带有`type`属性，称为“`radio”`。

**复选框**：在一组复选框中，每个复选框都单独运行，用户可以根据需要选择多个复选框。 在 HTML 中，使用`<input>`标签并将`type`属性称为“`checkbox`”来表示复选框。

现在我们对单选按钮和复选框的工作方式有了一些清晰的了解，让我们使用 Selenium WebDriver 进行一些有趣的操作。

1.  使用各种定位策略定位单选按钮和复选框
2.  检查是否显示单选按钮/复选框[提示：isDisplayed（）方法]
3.  检查单选按钮/复选框是否已启用，以便可以选择它[提示：isEnabled（）方法]
4.  检查默认情况下是否选中单选按钮/复选框[提示：isSelected（）方法]
5.  选择/单击单选按钮或复选框[提示：click（）]

这五个操作将与[演示站点](https://chandanachaitanya.github.io/selenium-practice-site/)中的示例一起进行说明。 它没有世界上最好的 UI，但目前已达到目的。

## 1.使用各种定位策略定位单选按钮和复选框

是时候再利用[定位策略](https://javabeginnerstutorial.com/selenium/9j-webdriver-locating-elements-1/)的功能了！

**示例**：让我们按 ID 定位“ Bicycle”复选框，按名称定位“ Tricycle”复选框，按 xPath 定位“ Sedan”复选框，并按“ Magazines”单选按钮定位 cssSelector。

右键单击所需元素，然后选择检查元素，将给出相应的 HTML 代码，如下所示，

```java
<input id="bicycle-checkbox" type="checkbox" name="vehicle1" value="Bicycle">&nbsp;Bicycle  
<input id="tricycle-checkbox" type="checkbox" name="vehicle2" value="Tricycle" disabled>&nbsp;Tricycle
<input id="sedan-checkbox" type="checkbox" name="vehicle5" value="Sedan">&nbsp;Sedan
<input id="magazines-radio-btn" type="radio" name="books" value="Magazines"> &nbsp;Magazines
```

*代码：*

```java
driver.findElement(By.id("bicycle-checkbox"));
driver.findElement(By.name("vehicle2"));
driver.findElement(By.xpath("//input[@name='vehicle5']"));
driver.findElement(By.cssSelector("input[value='Magazines']"));
```

## 2\. **检查单选按钮/复选框是否显示**

使用 Selenium WebDriver，检查特定的单选按钮或复选框是否按预期显示在网页上是小菜一碟！ 我们有 isDisplayed（）方法来进行救援。 此方法返回一个布尔值（`true` – 元素显示，`false` – 元素不显示）。

**示例**：让我们检查网页上是否显示了“ Tricycle”复选框。

各自的 HTML 代码供参考，

```java
<input id="tricycle-checkbox" type="checkbox" name="vehicle2" value="Tricycle" disabled>&nbsp;Tricycle
```

*Code:*

```java
driver.findElement(By.name("vehicle2")).isDisplayed();
```

## 3\. **检查单选按钮/复选框是否已启用，以便可以选择它**

同样，为了验证是否启用了特定的单选按钮或复选框，我们有 isEnabled（）方法。 这还会返回一个布尔值（ `true` – 元素已启用，`false` – 元素已禁用）。

**示例**：让我们检查是否启用了“ Tricycle”复选框。 如果是的话，让我们检查一下，否则我们只会在控制台上打印一条消息。

Respective HTML code for reference,

```java
<input id="tricycle-checkbox" type="checkbox" name="vehicle2" value="Tricycle" disabled>&nbsp;Tricycle
```

*Code:*

```java
WebElement tricycleCheckbox = driver.findElement(By.name("vehicle2"));
// Check if tricyle is enabled to select
if (tricycleCheckbox.isEnabled()) {
// Click if enabled
	tricycleCheckbox.click();
} else {
	// Print message to console if disabled
	System.out.println("Unable to select 'Tricycle' checkbox as it is disabled.");
}
```

## 4\. **检查默认情况下是否选中单选按钮/复选框**

为了验证默认情况下是否选中了特定的单选按钮或复选框，我们有 isSelected（）方法。 这还会返回一个布尔值（ **true** – 元素已选择， **false** – 未选择元素）。

**示例**：让我们检查一下默认情况下是否选中了“杂志”单选按钮。 如果是，请让我们将该消息打印到控制台，否则我们将单击它以选择“杂志”选项。

Respective HTML code for reference,

```java
<input id="magazines-radio-btn" type="radio" name="books" value="Magazines"> &nbsp;Magazines
```

*Code:*

```java
// Locate 'Magazines' radio button using cssSelector
WebElement magazinesRadioBtn = driver.findElement(By
				.cssSelector("input[value='Magazines']"));
// Check if radio button is selected by default
if (magazinesRadioBtn.isSelected()) {
        // Print message to console
	System.out.println("Magazines radio button is selected by default");
} else {
	// Click the radio button
	magazinesRadioBtn.click();
}
```

## 5\. **选择/单击单选按钮或复选框**

您为什么认为 Selenium WebDriver 中有`click()`？ 你懂我！ 选中单选按钮非常容易，对于复选框，可以使用相同的 click（）在选中和取消选中之间切换！

**示例**：让我们选中并取消选中“轿车”复选框。

Respective HTML code for reference,

```java
<input id="sedan-checkbox" type="checkbox" name="vehicle5" value="Sedan">&nbsp;Sedan
```

*Code:*

```java
// Locate 'Sedan' checkbox using xPath: contains() and text()
WebElement sedanCheckbox = driver.findElement(By.xpath("//input[@name='vehicle5']"));
for (int i = 0; i < 2; i++) {
// Click the checkbox
	sedanCheckbox.click();
	// Print current status to console
	System.out.println("Selection status of 'Sedan' checkbox: "
					+ sedanCheckbox.isSelected());
} 
```

此代码将在第一个迭代中选中“轿车”复选框，然后在第二个迭代中取消选中它。 选择状态消息将相应地打印到控制台。

## 总体图片

让我们来看一个测试案例，该案例实现了迄今为止本文中涵盖的所有操作，

*场景*

1.  打开 Firefox 浏览器。
2.  导航到[演示站点](https://chandanachaitanya.github.io/selenium-practice-site/)
3.  按名称找到“三轮车”复选框
4.  检查是否显示“三轮车”复选框，并将相应消息打印到控制台
5.  检查“三轮车”复选框是否已启用
6.  如果是，请单击复选框，如果否，则将相应消息打印到控制台
7.  根据“货车”和“ SUV”复选框的当前选择状态，选中或取消选中并在执行 click（）动作之前和之后打印状态
8.  使用 XPath 找到“轿车”复选框
9.  使用两次迭代在选择状态和取消选择状态之间切换
10.  使用 cssSelector 找到“杂志”单选按钮
11.  检查是否默认选中
12.  如果是，则将相应消息打印到控制台，否则，选择单选按钮
13.  验证 Eclipse IDE 控制台输出屏幕和 JUnit 窗格是否成功

此方案的 JUnit 代码是，

```java
package com.blog.junitTests;

import java.util.List;
import java.util.concurrent.TimeUnit;

import org.junit.After;
import org.junit.Before;
import org.junit.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;

public class RadioBtns_Checkboxes {
    // Declaring variables
    private WebDriver driver;
    private String baseUrl;

    @Before
    public void setUp() throws Exception {
        // Selenium version 3 beta releases require system property set up
        System.setProperty("webdriver.gecko.driver", "E:\\Softwares\\
Selenium\\geckodriver-v0.10.0-win64\\geckodriver.exe");
        // Create a new instance for the class FirefoxDriver
        // that implements WebDriver interface
        driver = new FirefoxDriver();
        // Implicit wait for 5 seconds
        driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);
        // Assign the URL to be invoked to a String variable
        baseUrl = "https://chandanachaitanya.github.io/selenium-practice-site/";
    }

    @Test
    public void testPageTitle() throws Exception {
        // Open baseUrl in Firefox browser window
        driver.get(baseUrl);

        // Locate 'Tricycle' checkbox using name
        WebElement tricycleCheckbox = driver.findElement(By.name("vehicle2"));
        // Check if tricyle is displayed
        System.out.println("Is tricycle displayed? "+ tricycleCheckbox.isDisplayed());

        // Check if tricyle is enabled to select
        if (tricycleCheckbox.isEnabled()) {
            // Click if enabled
            tricycleCheckbox.click();
        } else {
            // Print message to console if disabled
            System.out.println("Unable to select 'Tricycle' checkbox as it is disabled.");
        }

        //Get all checkbox elements in a list
        List<WebElement> list = driver.findElements(By
                .cssSelector("input[type='checkbox']"));

        // Loops through all checkboxe elements
        for (int i = 0; i < list.size(); i++) {
            // Checking if the checkbox is a 'Van' or 'SUV'
            if ((list.get(i).getAttribute("value").trim()
                    .equalsIgnoreCase("van"))
                    || (list.get(i).getAttribute("value").trim()
                            .equalsIgnoreCase("suv"))) {
                // Print selection status to console
                System.out.println("BEFORE: Is "
                        + list.get(i).getAttribute("value") + " selected? "
                        + list.get(i).isSelected());
                // Check if the checkbox is selected
                if (!(list.get(i).isSelected())) {
                    // Click the checkbox
                    list.get(i).click();
                    System.out.println("AFTER: Is "
                            + list.get(i).getAttribute("value") + " selected? "
                            + list.get(i).isSelected());
                } else {
                    // Uncheck the checkbox
                    list.get(i).click();
                    System.out.println("AFTER: Is "
                            + list.get(i).getAttribute("value") + " selected? "
                            + list.get(i).isSelected());
                }
                System.out.println("Next...");
            }
        }
        // Locate 'Sedan' checkbox using xPath
        WebElement sedanCheckbox = driver.findElement(By
                .xpath("//input[@name='vehicle5']"));
        System.out.println("Trying to select and de-select Sedan checkbox...");
        for (int i = 0; i < 2; i++) {
            // Click the checkbox
            sedanCheckbox.click();
            // Print current status to console
            System.out.println("Selection status of 'Sedan' checkbox: "
                    + sedanCheckbox.isSelected());
        }
        // Locate 'Magazines' radio button using cssSelector
        WebElement magazinesRadioBtn = driver.findElement(By
                .cssSelector("input[value='Magazines']"));
        // Check if radio button is selected by default
        if (magazinesRadioBtn.isSelected()) {
            // Print message to console
            System.out.println("Magazines radio button is selected by default");
        } else {
            // Click the radio button
            magazinesRadioBtn.click();
        }

    } //End of @Test

    @After
    public void tearDown() throws Exception {
        // Close the Firefox browser
        driver.close();
    }
}
```

*执行结果：*

除一个片段外，部分代码将作为本文讨论的每种技术的一部分进行解释。

所有类型为复选框的 Web 元素均在列表中获得，

```java
//Get all checkbox elements in a list
List<WebElement> list = driver.findElements(By.cssSelector("input[type='checkbox']")); 
```

如果列表中的所有复选框元素的属性值均与“范”和“ SUV”相匹配，则将对其进行验证。 他们的当前选择状态被打印到控制台作为一条消息，提示“之前”。

```java
// Loops through all checkboxe elements
for (int i = 0; i < list.size(); i++) {
	// Checking if the checkbox is a 'Van' or 'SUV'
	if ((list.get(i).getAttribute("value").trim().equalsIgnoreCase("van"))
||(list.get(i).getAttribute("value").trim().equalsIgnoreCase("suv"))) 
{
		// Print selection status to console
		System.out.println("BEFORE: Is "
			+ list.get(i).getAttribute("value") + " selected? "
				+ list.get(i).isSelected()); 
```

使用 isSelected（）方法，检查是否已选中“货车”或“ SUV”复选框。 如果未选中复选框，则将其选中，然后将其选择状态打印到控制台，显示“之后”。 如果已经选择了它们，然后再次单击以取消选择它们并将相应的消息打印到控制台。

```java
// Check if the checkbox is selected
if (!(list.get(i).isSelected())) {
// Click the checkbox								         list.get(i).click();
System.out.println("AFTER: Is "+ list.get(i).getAttribute("value") + " selected? "+ list.get(i).isSelected());
} else {
	// Uncheck the checkbox
	list.get(i).click();
	System.out.println("AFTER: Is "+ list.get(i).getAttribute("value") + " selected? "+ list.get(i).isSelected());
			}
	System.out.println("Next...");
	}
}
```

在 JUnit 窗口中，绿色条显示测试用例已成功执行。 控制台窗口显示没有任何错误。 它还按预期显示所有打印的消息。

![Checkbox output IDE](img/f61f8cf48823ef303b562801236faccc.png)

下图显示了成功执行测试脚本后获得的 Firefox 输出。

![Radio Buttons Output Browser](img/7169846461ce6135ab02ca0c7a8aae86.png)

是时候尝试今天的技能了。 是的，戴上安全帽，以免遇到任何异常！

再见。 祝你有美好的一天！

