Tìm hiểu cơ bản cách sử dụng Checkbox và Radio button trong Selenium WebDriver

Như ở bài trước mình đã giới thiệu với các bạn về cách truy cập các phần tử của form bằng Selenium Web Driver với Java. Hôm nay mình sẽ giới thiệu cho các bạn về một thành phần không thể thiếu ở mỗi form mà bạn thường gặp, đó là: Radio button và Checkbox. Trong bài viết này mình sẽ giới thiệu cho các bạn về cách chọn Checkbox và Radio button. Mình sẽ sử dụng trang web https://www.toolsqa.com/automation-practice-form/ này để demo cho các bạn xem. Vậy làm thế nào để chọn Radio button hoặc checkbox?

1. Sử dụng ID

Để chọn radio button hoặc checkbox thì bạn có thể sử dụng thuộc tính ID của nó. Ví dụ:

WebElement chooseId = driver.findElement(By.id("sex-0"));
chooseId.click();

2. Gọi phương thức IsSelected()

Vậy phương thức IsSelected() sử dụng trong trường hợp nào? Trong trường hợp bạn đã chọn hoặc bỏ chọn Checkbox hoặc Radio button và bạn muốn kiểm tra trạng thái cuối cùng của nó. Và sau đó, bạn có thể sử dụng phương thức IsSelected() để biết chính xác trạng thái của phần tử.

// Storing all the elements under category 'Sex' in the list of WebLements 
List<WebElement> list1 = driver.findElements(By.name("sex"));

// Create a boolean variable which will hold the value (True/False)
boolean is_selected  = false;

// This statement will return True, in case of first Radio button is selected
is_selected = list1.get(0).isSelected();

// This will check that if the bValue is True means if the first radio button is selected
if(is_selected  == true){
    // This will select Second radio button, if the first radio button is selected by default
    list1.get(1).click();
} else {
    // If the first radio button is not selected by default, the first will be selected
    list1.get(0).click();
}

Ở đây mình kiểm tra xem nếu Radio button đầu tiên có mặc định được chọn hay không. Nếu nó được chọn thì sẽ chọn Radio button thứ 2, còn nếu không thì thực hiện chọn nó.

3. Sử dụng giá trị của phần tử

Bạn có thể chọn Radio button hặc Checkbox bằng giá trị của chúng.

// Find the Check Box or radio button element by Name
List<WebElement> list2 = driver.findElements(By.name("profession"));

// This will tell you the number of Check Boxes are present
int count = list2.size();

// Start the loop from first Check Box to last Check Boxe
for(int i=0; i < count ; i++ ){
    // Store the Check Box name to the string variable, using 'Value' attribute
    String str = list2.get(i).getAttribute("value");

    // Select the Check Box it the value of the Check Box is same what you are looking for
    if (str.equalsIgnoreCase("Manual Tester")){ 
        list2.get(i).click();
        // This will take the execution out of for loop
        break;
    }
}

Ở đây mình sẽ chọn Checkbox nếu nó trùng với gía trị bạn muốn chọn

4. Sử dụng CssSelector

Một cách đơn giản để chọn Checkbox hoặc Radio button là sử dụng giá trị của nó:

WebElement oCheckBox = driver.findElement(By.cssSelector("input[value='Selenium IDE']"));
        oCheckBox.click();

5. Code hoàn chỉnh

package newPackage;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;
import java.util.List;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.WebElement;

public class Form {
    public static void main(String[] args) {

        // declaration and instantiation of objects/variables
        System.setProperty("webdriver.chrome.driver", "D:\\Seleum\\Chrome\\chromedriver.exe");

        WebDriver driver = new ChromeDriver();
        driver.manage().timeouts().implicitlyWait(100, TimeUnit.SECONDS);
        driver.get("http://toolsqa.com/automation-practice-form");
        // Storing all the elements under category 'Sex' in the list of WebLements
        List<WebElement> list1 = driver.findElements(By.name("sex"));

        // Create a boolean variable which will hold the value (True/False)
        boolean is_selected  = false;

        // This statement will return True, in case of first Radio button is selected
        is_selected = list1.get(0).isSelected();

        // This will check that if the bValue is True means if the first radio button is selected
        if(is_selected  == true){
            // This will select Second radio button, if the first radio button is selected by default
            list1.get(1).click();
        } else {
            // If the first radio button is not selected by default, the first will be selected
            list1.get(0).click();
        }

        WebElement chooseId  = driver.findElement(By.id("sex-0"));
        chooseId .click();

        // Find the Check Box or radio button element by Name
        List<WebElement> list2 = driver.findElements(By.name("profession"));

        // This will tell you the number of Check Boxes are present
        int count = list2.size();

        // Start the loop from first Check Box to last Check Boxe
        for(int i=0; i < count ; i++ ){
            // Store the Check Box name to the string variable, using 'Value' attribute
            String str = list2.get(i).getAttribute("value");

            // Select the Check Box it the value of the Check Box is same what you are looking for
            if (str.equalsIgnoreCase("Manual Tester")){
                list2.get(i).click();
                // This will take the execution out of for loop
                break;
            }
        }
        WebElement oCheckBox = driver.findElement(By.cssSelector("input[value='Selenium IDE']"));
        oCheckBox.click();
        driver.quit();
    }
}

Link demo các bạn tham khảo nhé: https://drive.google.com/file/d/1sioab0yFOgBlE5xHPhXyibh42eOatcp1/view

Hi vọng bài viết sẽ giúp ít với các bạn!

Tài liệu tham khảo:

https://www.techbeamers.com/checkbox-and-radio-button-webdriver/ https://www.toolsqa.com/selenium-webdriver/checkbox-radio-button-operations/ https://www.guru99.com/checkbox-and-radio-button-webdriver.html