Trong bài này, chúng ta sẽ đi vào chi tiết về cách định vị và tự động hóa các hành động cũng như xác thực trên checkbox trong Selenium WebDriver nhé.
Checkbox là gì?
Checkbox là một thành phần GUI, được sử dụng rộng rãi trên các trang web để cung cấp nhiều lựa chọn về một tùy chọn nào đó cho người dùng. Sau khi lựa chọn được thực hiện, nó sẽ giúp ghi lại để xử lý tiếp.
Checkbox có thể cho phép người dùng thực hiện:
- Một lựa chọn duy nhất từ danh sách các tùy chọn
- Nhiều lựa chọn từ danh sách các tùy chọn
- Đồng ý (hoặc bật/tắt) đối với một số yêu cầu nhất định trên trang web
Trong quá trình triển khai, checkbox được cho là có hai trạng thái:
- Khi nó được chọn, nó được gọi là Checked
- Khi nó được bỏ chọn, nó được gọi là UnChecked
Lưu ý: Một số ứng dụng cung cấp trạng thái trung gian (intermediate) còn được gọi là trạng thái “tri-state” trong đó thay vì dấu tích , là biểu hiện thông thường của checkbox đã chọn (checked), hộp được điền hoặc dấu gạch ngang được sử dụng để dành cho đã chọn (checked). Điều này xảy ra trong trường hợp chúng ta có các parent-child Checkboxes và một child Checkbox được chọn để thực hiện lựa chọn tự động cho tất cả các parent Checkboxes trong cấu trúc phân cấp.
Trong HTML, checkbox được tạo bắt đầu bằng thẻ input và type = checkbox. Chúng có hình ảnh là các ô vuông mà người dùng có thể chọn (check)/ bỏ chọn (uncheck). Khác với radio button, checkbox cho phép nguời dùng có thể chọn cùng lúc nhiều lưa chọn khác nhau.
Cách xử lý checkbox trong Selenium WebDriver
Scenario: Như ví dụ ở hình trên, chúng ta có 7 checkbox là 7 ngày trong tuần. Trong đó:
- Tuesday được chọn mặc định
- Wednesday, Sunday bị disable và không được phép chọn
- Saturday được chọn và không cho bỏ chọn (unchecked)
Người dùng chọn các ngày trong tuần
- Chọn Monday, Friday
- Bỏ chọn Tuesday
Các bước thực thi:
- Xác định locator của các checkbox. (Nếu bạn chưa biết cách, có thể tham khảo bài Selenium Locator)
- Đầu tiên chúng ta sẽ xác định locator của Checkbox đầu tiên – đó là Monday
- Lấy danh sách locator của các checkbox
- Xác nhận một checkbox được edit hay không, chúng ta sử dụng phương thức isEnable();
- Xác nhận một checkbox được chọn (checked) hay không, chúng ta sử dụng phương thức isSelected();
- Theo ví dụ chúng ta cần kiểm tra Nếu Tuesday được chọn (checked), thì chúng ta sẽ bỏ chọn.
- Việc chọn hoặc không chọn (checked/unchecked) (hoặc bật/tắt) một checkbox được thực hiện bằng phương thức click()
- Để lặp qua hết danh sách các checkbox locator, chúng ta có thể sử dụng for loop, hay for .. each loop …
Code example
Các bạn có thể download file HTML ví dụ về checkbox tại đây
