Selenium là một trong những Automation tool phổ biến nhất hiện nay để thực thi Automation Test. Với tính tiện lợi và linh hoạt như được sử dụng trên nhiều trình duyệt web khác nhau cũng như các ngôn ngữ lập trình khác nhau. Điểm chung của các Automation Tool, cụ thể là automate giao diện người dùng (GUI), là bắt chước cách của một người dùng thực tế sẽ sử dụng ứng dụng. Ví dụ, bạn là người dùng Google, bạn nhập thông tin muốn tìm trên thanh tìm kiếm, sau đó nhấn phím Enter.
Bây giờ, bạn tưởng tượng là Selenium sẽ phải bắt chước hành vi của người dùng để có thể thực thi y như vậy. Vấn đề là làm cách nào chúng ta có thể nói cho Selenium biết được vị trí Search field ở đâu trên trang web để có thể nhập nội dung tìm kiếm vào.
Đó chính là Selenium Locator. Locator sẽ giúp nhận dạng các thành phần (WebElements) của một website, và Search field chính là một web element. Để xem các element của trang web, bạn nhấn F12 nhé.
WebDriver cung cấp 2 method để tìm element trên trang web.
- findElement(By by) => Phương thức này trả về một đối tượng(object) WebElement
- findElements(By by) => Phương thức này trả về danh sách các đối tượng(object) WebElement
Trong bài này chúng ta cùng tìm hiểu Locator hoạt động thế nào nhé!
Selenium cung cấp 8 loại Locator cho webDriver như sau:
ID
Sử dụng ID là một trong những cách phổ biến nhất để tìm một phần tử (element). ID được xem là lựa chọn an toàn và nhanh nhất trong số các locator.
Nhưng trên các trang web động, ID có thể thay đổi mỗi khi trang được refresh lại. Vì vậy, khi sử dụng ID, bạn hãy đảm bảo rằng ID là duy nhất (unique).
Cú pháp:
By.id (“{tên của id}”)Ví dụ: Tìm locator của Search fied, có ID = “input”
driver.findElement(By.id (“input”));
Name
Tìm một phần tử web theo tên (name) giống với tìm phần tử theo ID. Tuy nhiên thực tế các name thường được lặp lại trên một trang, vì vậy khi sử dụng name bạn phải đảm bảo rằng nó là duy nhất (unique)
Cú pháp:
By.name (“{tên của name}”)Ví dụ: Tìm locator của Search fied trên trang YourLogo có name = “search_query”
driver.findElement(By.name ("search_query"));
Class name
ClassName sử dụng thuộc tính (attribute) “class” để xác định phần tử web.
Cú pháp:
By.className(“{tên của class}”)Ví dụ: Tìm locator của button Google Search trên trang Google có class name = “gNO89b”
driver.findElement(By.classname ("gNO89b"));LinkText
LinkText được dùng đối với các liên kết (hyperlink), với sự trợ giúp của thẻ liên kết <a> và dựa trên văn bản (text) được hiển thị thực tế trên trang web. Webdriver sẽ tìm phần tử (element) của văn bản đó.
Cú pháp:
By.linkText(“{tên của text}”)Ví dụ: Tìm locator của “Software Testing”
driver.findElement(By.linkText("Software Testing"));PartialLinktext
Cũng giống với locator linkText, partialLinkText được dùng đối với các thẻ liên kết (hyperlink) <a>, nhưng tìm với một phần văn bản trong phần tử linkText
Cú pháp:
By.partialLinkText("tên của text}”)Ví dụ: Tìm locator của “Software Testing” như hình trên nhưng nhưng chúng ta chỉ tìm với từ “Software”
driver.findElement(By.partialLinkText("Software"));Tag name
Tên thẻ (tagName) phụ thuộc vào thẻ(tag) của phần tử (element). Nó thường ở phần đầu và thường không phải là duy nhất, vì vậy bạn lưu ý không nên dựa vào phương pháp này quá nhiều sẽ dễ làm lỗi script. Một số thẻ phổ biến là <div>, <input>, <button> …
Cú pháp:
By.tagName(“{tên của tag}”)Ví dụ: Tìm locator của logo DevOpsify
driver.findElement(By.tagName("img"));CSS selector
Đây là lúc mọi thứ trở nên phức tạp hơn một chút. CSS hoặc Cascading style sheet được sử dụng để tạo kiểu cho các trang web và chúng ta có thể sử dụng nó để xác định một hoặc nhiều phần tử trong trang web. CSS selector luôn là cách hiệu quả nhất để định vị các phần tử (element) phức tạp trong trang vì tính độc đáo của nó và khả năng kết hợp với các phương pháp khác.
Cú pháp:
By.cssSelector(“{[attribte=value]}”}Ví dụ: Tìm locator của “Tìm kiếm” fied sử dụng cssSelector
Ở đâychúng ta thấy tag name cho element sẽ là “input” và thuộc tính (attribute) là name với giá trị (value) là “s”
driver.findElement(By.cssSelector(“input[name=’s’]”));Còn rất nhiều điều có thể làm với bộ chọn CSS nhưng chúng ta sẽ có tìm hiểu ở một bài viết khác nhé.
XPath
XPath là một công cụ phức tạp khác giống như CSS Selector. XPath sử dụng XML để định vị phần tử web. Vì nó sử dụng XML nên nó cũng sẽ chậm hơn so với CSS Selector nhưng nó được xem là một chiến lược quan trọng để định vị các phần tử (element) trong Selenium. Nó cũng bao gồm một biểu thức với đường dẫn (path) cùng với một số điều kiện. Bạn có thể dễ dàng viết một tập lệnh/truy vấn XPath để xác định được vị trí của bất kỳ phần tử nào trong trang web.
Có 2 loại XPath
- Absolute Xpath
- Relative Xpath
Cú pháp:
By.xpath(“//{[@attribte=value]}”}Ví dụ: Tìm locator của “Tìm kiếm” fied sử dụng XPath
Chúng ta thấy tag name cho element sẽ là “input” và thuộc tính (attribute) là name với giá trị (value) là “s”, vậy cú pháp được viết như sau:
driver.findElement(By.xpath("//input[@name='s']"));Cũng giống với CSS Selector, chúng ta sẽ tìm hiểu XPath ở bài viết khác nhé.
Comments 1