Cách bấm vào hình ảnh trong Selenium webdriver
⚡ Tóm tắt thông minh
Nhấp chuột vào hình ảnh trong Selenium WebDriver yêu cầu sử dụng bộ chọn CSS hoặc chiến lược XPath vì các phần tử hình ảnh không hiển thị văn bản liên kết. Bài viết này giải thích cách định vị hình ảnh, kích hoạt hành động nhấp chuột và xác minh rằng việc điều hướng thành công.

Nhấp chuột vào hình ảnh trong Selenium WebDriver là một công việc phổ biến khi biểu tượng, logo hoặc hình thu nhỏ hoạt động như một liên kết điều hướng. Vì hình ảnh không chứa văn bản hiển thị, các bộ định vị văn bản liên kết truyền thống sẽ không hiệu quả và cần một chiến lược chọn lọc đáng tin cậy hơn.
Truy cập liên kết hình ảnh
Liên kết hình ảnh là các điểm neo trên trang web được biểu thị bằng hình ảnh, khi nhấp vào sẽ điều hướng trình duyệt đến một cửa sổ hoặc trang khác.
Vì chúng là hình ảnh, chúng ta không thể sử dụng các phương thức By.linkText() và By.partialLinkText() vì các liên kết hình ảnh không có văn bản liên kết nào cả.
Trong trường hợp này, chúng ta nên sử dụng By.cssSelector hoặc By.xpath. Phương pháp đầu tiên thường được ưu tiên hơn vì tính đơn giản và dễ đọc của nó.
Trong ví dụ bên dưới, chúng ta sẽ truy cập vào logo “Facebook” ở phần trên bên trái của trang Khôi phục mật khẩu của Facebook.
Chúng ta sẽ sử dụng By.cssSelector và thuộc tính “title” của phần tử để truy cập liên kết hình ảnh. Sau đó, chúng ta sẽ kiểm tra xem trình duyệt đã được chuyển đến trang chủ của Facebook hay chưa.
Java Code Ví dụ
Sau đây Selenium Đoạn mã WebDriver này khởi chạy Chrome, mở trang khôi phục mật khẩu Facebook, nhấp vào hình ảnh biểu tượng Facebook và xác nhận tiêu đề trang hiển thị.
package newproject;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
public class MyClass {
public static void main(String[] args) {
String baseUrl = "https://www.facebook.com/login/identify?ctx=recover";
System.setProperty("webdriver.chrome.driver", "G:\\chromedriver.exe");
WebDriver driver = new ChromeDriver();
driver.get(baseUrl);
// click on the "Facebook" logo on the upper left portion
driver.findElement(By.cssSelector("a[title=\"Go to Facebook home\"]")).click();
// verify that we are now back on Facebook's homepage
if (driver.getTitle().equals("Facebook - log in or sign up")) {
System.out.println("We are back at Facebook's homepage");
} else {
System.out.println("We are NOT in Facebook's homepage");
}
driver.close();
}
}
Kết quả
Các phương pháp tốt nhất để chụp ảnh
Một vài thói quen giúp tự động hóa nhấp chuột vào hình ảnh hoạt động đáng tin cậy hơn trên nhiều trình duyệt và kích thước màn hình khác nhau.
- Nên ưu tiên sử dụng các thuộc tính ổn định như title, alt, aria-label hoặc data-* thay vì các đường dẫn CSS lồng nhau quá sâu.
- Thêm lệnh WebDriverWait rõ ràng cho sự kiện ElementToBeClickable trước khi thực hiện thao tác nhấp chuột.
- Đối với hình ảnh được tải chậm, hãy cuộn phần tử vào tầm nhìn bằng JavascriptNgười thi hành án trước.
- Nếu một lớp phủ trong suốt chặn cú nhấp chuột, hãy chuyển sang phương án dự phòng. JavaNhấp chuột vào phần tử bên dưới bằng đoạn mã.
- Xác thực điều hướng bằng cách sử dụng driver.getTitle() hoặc một phần tử duy nhất trên trang đích.
Cách trí tuệ nhân tạo cải thiện các chiến lược định vị hình ảnh
các công cụ kiểm thử hỗ trợ bởi trí tuệ nhân tạo như TestimMabl và Healenium phân tích DOM xung quanh một hình ảnh và đề xuất các bộ định vị tự phục hồi. Khi tên lớp hoặc thuộc tính thay đổi sau khi phát hành, khung phần mềm sẽ tự động thay thế bằng phương án ổn định nhất, giúp giảm thiểu các lỗi không ổn định trong điều hướng dựa trên biểu tượng.
Các kỹ sư cũng có thể sử dụng ChatGPT hoặc GitHub Copilot để tạo các đoạn mã WebDriver, đề xuất các biểu thức CSS hoặc XPath mạnh mẽ cho hình ảnh và soạn thảo các khẳng định cho trang tải sau khi nhấp chuột. Mã được tạo ra vẫn cần được xem xét lại về tính chính xác và khả năng xử lý các thao tác chờ và lớp phủ.
Kết luận
Nhấp vào các liên kết hình ảnh trong Selenium WebDriver khá đơn giản một khi bạn đã chọn được một bộ định vị ổn định. Sử dụng `By.cssSelector` với thuộc tính `title` hoặc `alt` là cách dễ đọc nhất, `By.xpath` là phương án dự phòng khi mã HTML phức tạp, và việc sử dụng các lệnh chờ rõ ràng giúp cho script hoạt động đáng tin cậy trong các lần chạy khác nhau.

.png)
.png)