Cách xác minh chú giải công cụ trong Selenium
Krishna rừng ta
Chú giải công cụ trong Selenium
A Chú giải công cụ trong Selenium là văn bản xuất hiện khi con chuột di chuột qua một đối tượng trên trang web. Đối tượng có thể là một liên kết, một hình ảnh, một nút, một vùng văn bản, v.v. Văn bản chú giải công cụ thường cung cấp thêm thông tin về đối tượng mà người dùng di chuột qua con trỏ chuột.
Chú giải công cụ theo truyền thống được triển khai dưới dạng thuộc tính 'tiêu đề' cho một phần tử. Giá trị của thuộc tính này được hiển thị dưới dạng chú giải công cụ khi di chuột. Đây là văn bản tĩnh cung cấp thông tin về phần tử không có kiểu dáng.
Hiện nay, có rất nhiều plugin có sẵn để triển khai 'thủ thuật công cụ'. Chú giải công cụ nâng cao với kiểu dáng, kết xuất, hình ảnh và liên kết đang được triển khai bằng cách sử dụng JavaPlugin Script/JQuery hoặc sử dụng CSS Tooltips.
- Để truy cập hoặc xác minh các chú giải công cụ tĩnh được triển khai bằng thuộc tính “title” HTML, chúng ta chỉ cần sử dụng phương thức getAttribution(“title”) của WebElement. Giá trị trả về của phương pháp này (là văn bản chú giải công cụ) được so sánh với giá trị dự kiến để xác minh.
- Đối với các hình thức triển khai chú giải công cụ khác, chúng tôi sẽ phải sử dụng “API tương tác người dùng nâng cao” do Trình điều khiển web cung cấp để tạo hiệu ứng di chuột và sau đó truy xuất chú giải công cụ cho phần tử.
Tóm tắt về API tương tác người dùng nâng cao
API tương tác người dùng nâng cao cung cấp API cho các hành động của người dùng như kéo và thả, di chuột, chọn nhiều mục, nhấn và thả phím cũng như các hành động khác bằng bàn phím hoặc chuột trên trang web.
Bạn có thể tham khảo cái này liên kết này để biết thêm chi tiết về API.
Ở đây, hãy xem cách sử dụng một số lớp và phương thức mà chúng ta cần để di chuyển phần tử thanh trượt bằng một offset.
Bước 1) Để sử dụng API, cần phải nhập các gói/lớp sau:
Bước 2) Tạo một đối tượng của lớp “Hành động” và xây dựng Chuỗi hành động của người dùng. Lớp hành động được sử dụng để xây dựng chuỗi hành động của người dùng như moveToElement(), dragAndDrop(), v.v. API cung cấp nhiều phương thức khác nhau liên quan đến hành động của người dùng.
Đối tượng trình điều khiển được cung cấp dưới dạng tham số cho hàm tạo của nó.
Bước 3) Tạo một Action Object bằng cách sử dụng phương thức build() của lớp “Actions”. Gọi phương thức performance() để thực thi tất cả các hành động được tạo bởi đối tượng Hành động (trình tạo ở đây).
Chúng ta đã thấy cách sử dụng một số phương thức Hành động của người dùng do API cung cấp – clickAndHold(element), moveByOffset(10,0), Release(). API cung cấp nhiều phương pháp như vậy.
Tham khảo đến liên kết này để biết thêm chi tiết.
Cách xác minh chú giải công cụ (Xử lý) trong Selenium
Hãy xem minh họa cách truy cập và xác minh các mẹo công cụ trong kịch bản đơn giản
- Tình huống 1: Chú giải công cụ được triển khai bằng thuộc tính “title”
- Tình huống 2: Chú giải công cụ được triển khai bằng plugin jQuery.
Kịch bản 1: Thuộc tính 'tiêu đề' HTML
Trong trường hợp này, hãy lấy trang web ví dụ – https://demo.guru99.com/test/social-icon.html.
Chúng tôi sẽ cố gắng xác minh chú giải công cụ của biểu tượng “github” ở trên cùng bên phải của trang.
Để làm điều đó, trước tiên chúng ta sẽ tìm phần tử và lấy thuộc tính 'title' của nó rồi xác minh bằng văn bản mẹo công cụ dự kiến.
Vì chúng tôi giả sử mẹo công cụ nằm trong thuộc tính “title”, nên chúng tôi thậm chí không tự động hóa hiệu ứng di chuột mà chỉ truy xuất giá trị của thuộc tính bằng phương thức “getAttribution()”.
Đây là mã
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;
public class ToolTip {
public static void main(String[] args) {
String baseUrl = "https://demo.guru99.com/test/social-icon.html";
System.setProperty("webdriver.chrome.driver","G:\\chromedriver.exe");
WebDriver driver = new ChromeDriver();
driver.get(baseUrl);
String expectedTooltip = "Github";
// Find the Github icon at the top right of the header
WebElement github = driver.findElement(By.xpath(".//*[@class='soc-ico show-round']/a[4]"));
//get the value of the "title" attribute of the github icon
String actualTooltip = github.getAttribute("title");
//Assert the tooltip's value is as expected
System.out.println("Actual Title of Tool Tip"+actualTooltip);
if(actualTooltip.equals(expectedTooltip)) {
System.out.println("Test Case Passed");
}
driver.close();
}
}
Giải thích mã
- Tìm WebElement đại diện cho biểu tượng “github”.
- Lấy thuộc tính “title” của nó bằng phương thức getAttribution().
- Khẳng định giá trị so với giá trị chú giải công cụ dự kiến.
Kịch bản 2: Plugin JQuery
Có rất nhiều plugin JQuery có sẵn để triển khai các chú giải công cụ và mỗi plugin có một hình thức triển khai hơi khác nhau.
Một số plugin yêu cầu HTML chú giải công cụ luôn hiển thị bên cạnh phần tử mà chú giải công cụ có thể áp dụng trong khi các plugin khác tạo thẻ “div” động, xuất hiện nhanh chóng khi di chuột qua phần tử.
Để minh họa, hãy xem xét cách triển khai chú giải công cụ “Công cụ jQuery”.
Ở đây trong URL – https://demo.guru99.com/test/tooltip.html bạn có thể xem bản demo khi di chuột qua “Tải xuống ngay”, chúng tôi nhận được chú giải công cụ nâng cao có hình ảnh, nền chú thích, bảng và liên kết bên trong có thể nhấp vào được.
Nếu nhìn vào nguồn bên dưới, bạn có thể thấy rằng thẻ div đại diện cho chú giải công cụ luôn xuất hiện bên cạnh thẻ của liên kết “Tải xuống ngay”. Tuy nhiên, mã bên trong thẻ script bên dưới sẽ kiểm soát thời điểm nó cần bật lên.
Hãy thử xác minh văn bản liên kết trong chú giải công cụ để minh họa tại đây.
Đầu tiên chúng ta sẽ tìm WebElement tương ứng với “Download now”. Sau đó, sử dụng API Tương tác, chúng ta sẽ chuyển sang phần tử (di chuột). Tiếp theo, chúng ta sẽ tìm WebElement tương ứng với liên kết bên trong chú giải công cụ được hiển thị và xác minh nó với văn bản dự kiến.
Đây là mã
import org.openqa.selenium.interactions.Action;
import org.openqa.selenium.interactions.Actions;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.*;
public class JqueryToolTip {
public static void main(String[] args) {
String baseUrl = "https://demo.guru99.com/test/tooltip.html";
System.setProperty("webdriver.chrome.driver","G:\\chromedriver.exe");
WebDriver driver = new ChromeDriver();
String expectedTooltip = "What's new in 3.2";
driver.get(baseUrl);
WebElement download = driver.findElement(By.xpath(".//*[@id='download_now']"));
Actions builder = new Actions (driver);
builder.clickAndHold().moveToElement(download);
builder.moveToElement(download).build().perform();
WebElement toolTipElement = driver.findElement(By.xpath(".//*[@class='box']/div/a"));
String actualTooltip = toolTipElement.getText();
System.out.println("Actual Title of Tool Tip "+actualTooltip);
if(actualTooltip.equals(expectedTooltip)) {
System.out.println("Test Case Passed");
}
driver.close();
}
}
Giải thích mã
- Tìm WebElement tương ứng với phần tử “download now” mà chúng ta sẽ di chuột.
- Bằng cách sử dụng API Tương tác, hãy di chuột vào phần “Tải xuống ngay”.
- Giả sử chú giải công cụ được hiển thị, hãy tìm WebElement tương ứng với liên kết bên trong chú giải công cụ, tức là thẻ “a”.
- Xác minh văn bản chú giải công cụ của liên kết được truy xuất bằng cách sử dụng getText() so với giá trị mong đợi mà chúng tôi đã lưu trữ trong “expectedToolTip”
Tổng kết
Trong hướng dẫn này, bạn đã học cách truy cập Chú giải công cụ bằng cách sử dụng Selenium Trình điều khiển web.
Mẹo công cụ được triển khai theo nhiều cách khác nhau–
- Việc triển khai cơ bản dựa trên thuộc tính “tiêu đề” của HTML. getAttribution(title) nhận giá trị của chú giải công cụ.
- Việc triển khai mẹo công cụ khác như JQuery, chú giải công cụ CSS yêu cầu API tương tác để tạo hiệu ứng di chuột
API tương tác người dùng nâng cao–
- moveToElement(element) của lớp Actions được sử dụng để di chuột vào một phần tử.
- Phương thức Build() của lớp Actions xây dựng chuỗi hành động của người dùng thành một đối tượng Action.
- Performance() của lớp Action thực thi tất cả chuỗi hành động của người dùng cùng một lúc.
Để xác minh chú giải công cụ, trước tiên chúng ta phải di chuột vào phần tử, sau đó tìm phần tử tương ứng với mẹo công cụ và lấy văn bản hoặc các giá trị khác của nó để xác minh so với các giá trị mong đợi.
