Tin tức và phân tích của tất cả các thiết bị di động

Làm chủ XPath trong Selenium: Cách xác định vị trí các phần tử

Các kỹ sư kiểm tra rất cần thiết trong vòng đời phần mềm vì họ đảm bảo rằng nhóm cung cấp các ứng dụng hoạt động và không có lỗi. Các kỹ sư này thực hiện nhiều thử nghiệm khác nhau trên ứng dụng trước khi chúng được vận chuyển hoặc được tuyên bố là sẵn sàng cho người dùng.

Người kiểm tra phải có kỹ năng và có thể xác định vị trí cũng như tương tác với các thành phần web. Selenium là một trong những công cụ tự động hóa thử nghiệm được sử dụng nhiều nhất bởi các nhóm phát triển hiện đại. Công cụ này có bốn thành phần; Lưới Selenium, Selenium WebDriver, Selenium IDE và Selenium RC.

Hôm nay chúng ta sẽ tập trung vào Selenium WebDriver vì nó bao gồm XPath. Bài viết này sẽ định nghĩa XPath, thảo luận cú pháp XPath cơ bản và minh họa cách sử dụng XPath trong Selenium.

XPath là gì

XPath (Ngôn ngữ đường dẫn XML) là ngôn ngữ truy vấn để chọn và điều hướng các thuộc tính và thành phần trong tài liệu XML. XPath xác định một biểu thức đường dẫn, đưa ra cách giải quyết các phần cụ thể của tài liệu XML và truy xuất thông tin từ đó.

Cú pháp của nó giống với đường dẫn hệ thống tập tin. Nó cũng bao gồm các tính năng và biểu tượng giúp bạn dễ dàng chọn các mục dựa trên thuộc tính và thứ bậc của chúng. Bạn có thể sử dụng XPath với các công nghệ như XML, HTML và XSLT để trích xuất và thao tác dữ liệu.

Tại sao nên sử dụng XPath?

  • Tính linh hoạt: Không giống như bộ chọn CSS, chỉ có thể định vị các phần tử bằng tên thẻ, ID hoặc lớp, XPath cho phép bạn định vị các phần tử bằng các thuộc tính khác.
  • Tái sử dụng: Bạn có thể lưu trữ XPath trong các biến và sử dụng lại chúng trong mã của mình.
  • Lựa chọn nút chính xác: XPath cung cấp một cách tiêu chuẩn hóa để nhắm mục tiêu các phần tử cụ thể trong tài liệu web.

Cú pháp XPath cơ bản

XPath cho phép bạn tìm bất kỳ phần tử nào trong trang web bằng DOM. Tuy nhiên, trước khi kiểm tra cú pháp, chúng ta cần hiểu các biểu thức XPath sau;

ExpressionDescriptionnodename/variablenameChọn tất cả các nút có tên “nodename”/”tagname”/Chọn từ nút gốc//Chọn các nút trong tài liệu hiện tại từ nút hiện tại phù hợp với lựa chọn, bất kể chúng nằm ở đâu@Chọn thuộc tính..Chọn cha của nút hiện tại. Chọn nút hiện tại

Cú pháp XPath tiêu chuẩn là;

XPath=//tagname[@attribute="value"]

Như bạn có thể thấy, cú pháp bắt đầu bằng dấu gạch chéo kép (//) bắt đầu bằng nút hiện tại được chỉ định bởi tên thẻ/nút.

XPath tuyệt đối so với XPath tương đối

Có hai đường dẫn khi xử lý XPath; XPath tuyệt đối và XPath tương đối;

XPath tuyệt đối

Đường dẫn tuyệt đối XPath là đường dẫn trực tiếp từ gốc đến mục mong muốn. Bạn bắt đầu ở nút gốc và kết thúc ở nút đích.

Bạn có thể có một tài liệu HTML có nội dung sau;

<!DOCTYPE html>
<html>
<head>
    <title>newsblog.pl</title>
</head>
<body>
    <div>
        <h1>Welcome to newsblog.pl</h1>
    </div>
</body>
</html>

Nếu chúng tôi muốn tìm một mục có nội dung “Chào mừng đến với newsblog.pl”, chúng tôi sẽ đi theo con đường này;

/html/body/div/h1

Trong tài liệu trên chúng ta có;

  • HTML làm nút gốc: /html
  • Phần thân là nút cha: /html/body
  • Div là con của nút cơ thể: /html/body/div
  • H1 là con của nút div: /html/body/div/h1

Để có được phần tử sâu sắc nhất, bạn phải đi theo con đường này.

Khi nào nên sử dụng XPath tuyệt đối

XPath tuyệt đối đi theo một đường dẫn “được chỉ định”. Vì vậy, nó sẽ là sự kết hợp hoàn hảo khi có nhiều phần tử có thuộc tính tương tự nhau trên trang, đảm bảo rằng bạn đang nhắm mục tiêu chính xác những phần tử đó trong tài liệu.

Tuy nhiên, XPath quá nhạy cảm với những thay đổi trong cấu trúc của tài liệu HTML. Vì vậy, một thay đổi đơn giản cũng có thể phá vỡ Tuyệt đối XPath.

XPath tương đối

XPath tương đối bắt đầu từ bất kỳ nút nào và kết thúc tại nút đích. Đường dẫn này không bị ảnh hưởng bởi những thay đổi của tài liệu, khiến nó trở thành đường dẫn ưa thích trong hầu hết các trường hợp. XPath tương đối cho phép bạn định vị các phần tử từ bất kỳ phần nào của tài liệu. Biểu thức XPath tương đối bắt đầu bằng dấu gạch chéo kép “//”.

Nếu chúng tôi sử dụng tài liệu HTML, chúng tôi có thể tìm thấy H1 có nội dung “Chào mừng đến với newsblog.pl”;

<!DOCTYPE html>
<html>
<head>
    <title>newsblog.pl</title>
</head>
<body>
    <div>
        <h1>Welcome to newsblog.pl</h1>
    </div>
</body>
</html>

XPath tương đối của chúng tôi với h1 sẽ là;

//body/div/h1

Khi nào nên sử dụng XPath tương đối

Bạn nên sử dụng XPath tương đối khi bạn đang tìm kiếm sự cân bằng giữa tính linh hoạt và tính đặc hiệu. Đường dẫn này miễn nhiễm với những thay đổi trong tài liệu HTML, vì mối quan hệ giữa các phần tử vẫn cụ thể.

Xác định vị trí các phần tử bằng XPath trong Selenium

Selenium là một nền tảng nguồn mở cho phép người dùng tự động hóa trình duyệt web. Khung này chứa một tập hợp các thư viện và công cụ giúp người kiểm tra tương tác tự động và có hệ thống với các thành phần mạng.

Giả sử chúng ta có một tài liệu web chứa danh sách bài hát sau;

<!DOCTYPE html>
<html>
<head>
    <title>Song Library</title>
</head>
<body>
    <h1>Song Library</h1>
    <ul class="song-list">
        <li class="song" title="Song Title 1">Song 1 - Artist 1</li>
        <li class="song" title="Song Title 2">Song 2 - Artist 2</li>
        <li class="song" title="Song Title 3">Song 3 - Artist 1</li>
        <li class="song" title="Song Title 4">Song 4 - Artist 3</li>
    </ul>
</body>
</html>
  • Nút gốc của chúng tôi là .
  • Chúng tôi có nút gốc của chúng tôi.
  • Chúng ta có
  • Chúng ta có
  • Chúng ta có
  • khi còn nhỏ

Chúng ta có thể sử dụng các bộ định vị XPath khác nhau trong tài liệu HTML ở trên. Ví dụ: chúng ta có thể định vị các mục theo id, tên, tên lớp, nội dung, văn bản, kết thúc bằng và bắt đầu bằng, trong số nhiều công cụ định vị khác. Bạn có thể sử dụng Selenium với nhiều ngôn ngữ lập trình khác nhau. Chúng tôi sẽ sử dụng Python để trình diễn.

Xác định vị trí theo chỉ mục

Giả sử chúng ta muốn xác định vị trí số bản nhạc 3chúng ta có thể có mã này;

third_song = driver.find_element_by_xpath("//li[@class="song"][3]")
print("Third Song:", third_song.text)

Chúng tôi đã sử dụng XPath tương đối và bắt đầu với nút “li”. Khi Selenium định vị bài hát thứ ba trong danh sách của chúng tôi, nó sẽ in lời bài hát.

Xác định vị trí theo thuộc tính

Chúng ta có thể có XPath tìm kiếm tất cả các bài hát từ “Artist 1và in tiêu đề của họ. Mã của chúng tôi có thể trông như thế này;

songs_by_artist1 = driver.find_elements_by_xpath("//li[contains(@class, 'song') and contains(text(), 'Artist 1')]")
print("Songs by Artist 1:")
for song in songs_by_artist1:
    print(song.text)

Xác định vị trí bằng văn bản

Công cụ định vị này giúp bạn tìm các mục có văn bản cụ thể. Chúng ta có thể tìm kiếm một bài hát có nội dung “Bài hát 4” và in văn bản của nó. Chúng ta có thể biểu diễn bộ định vị này bằng mã này;

song_with_text = driver.find_element_by_xpath("//li[contains(text(), 'Song 4')]")
print("Song with Text:", song_with_text.text)

Trục XPath

Các phương pháp tiếp cận mà chúng tôi đã đề cập đến nay có tác dụng rất tốt đối với các trang web đơn giản. Tuy nhiên, có những trường hợp các phương thức tìm kiếm phần tử XPath như văn bản, id, tên lớp và tên sẽ không hoạt động.

Trục XPath được sử dụng cho nội dung động nơi các bộ định vị thông thường không hoạt động. Ở đây bạn xác định vị trí các phần tử dựa trên mối quan hệ của chúng với các phần tử khác. Dưới đây là một số bộ định vị trục XPath phổ biến;

tổ tiên

Phương pháp Ancestor Axis là phương pháp lý tưởng để xử lý các tài liệu XML có các phần tử lồng nhau chặt chẽ. Bạn có thể chọn tất cả các phần tử tổ tiên, chẳng hạn như ông bà và cha mẹ của nút hiện tại, từ gần nhất đến xa nhất.

Chúng ta có thể có đoạn mã sau;

<bookstore>
  <book>
    <title>The Great Gatsby</title>
    <author>F. Scott Fitzgerald</author>
    <genre>Fiction</genre>
  </book>
  <book>
    <title>The Biggest Dilemma</title>
    <author>George Orwell</author>
    <genre>Dystopian</genre>
  </book>
</bookstore>

Nếu chúng ta muốn chọn tất cả các tổ tiên của thành phần tiêu đề cho Thế tiến thoái lưỡng nan lớn nhất, chúng ta có thể sử dụng phương pháp Trục tổ tiên;

//title[text() = '1984']/ancestor::*

Kế tiếp

Phương thức Follow Axis định vị tất cả các nút sau thẻ đóng của nút hiện tại. Phương pháp này không xem xét thứ bậc hoặc vị trí của các nút mục tiêu. Ví dụ: nếu bạn có một tài liệu XML hoặc trang web có nhiều phần, bạn có thể xác định phần tử đứng sau một phần cụ thể mà không cần điều hướng toàn bộ cấu trúc cây.

Cha mẹ

Phương thức Parent Axis trong XPath chọn nút cha của nút hiện tại. Bạn có thể sử dụng đường dẫn sau để định vị nút cha;

//tag[@attribute="value"]/parent::tagName

Cách tiếp cận này hoạt động khi các phần tử con trong nút hiện tại có các thuộc tính duy nhất mà bạn có thể dễ dàng xác định và bạn muốn kiểm tra với nút gốc.

Đứa trẻ

Phương thức Trục con trong XPath chọn tất cả nút con của nút hiện tại. Nó vẫn là một trong những phương pháp trục XPath phổ biến nhất vì nó giúp chọn các nút con của một phần tử cụ thể.

Hãy xem xét đoạn mã này;

<section id='text'>
    <p>Paragraph one</p>
    <p>Paragraph two</p>
    <p>Paragraph three</p>
    <p>Paragraph four</p>
</section>

Sử dụng trục này, chúng ta có thể định vị tất cả các phần tử ‘p’ trong mã của mình;

//section[@id='text']/child::p

Các câu hỏi thường gặp

Tại sao nên sử dụng XPath thay vì bộ chọn CSS?

Bộ chọn CSS chỉ có thể tìm thấy các thành phần dựa trên ID, tên thẻ và lớp của chúng. Mặt khác, bạn có thể sử dụng XPath để định vị các phần tử dựa trên vị trí, nội dung văn bản và các thuộc tính khác trong cấu trúc HTML của chúng. Bạn cũng có thể lưu trữ các biểu thức XPath trong các biến và sử dụng lại chúng trong ứng dụng của mình.

XPath hỗ trợ những ngôn ngữ nào trong Selenium?

Bạn có thể sử dụng XPath với bất kỳ ngôn ngữ nào hỗ trợ Selenium. Bạn có thể viết tập lệnh bằng JavaScript, Java, Python, Ruby, C# và PHP.

Các lựa chọn thay thế cho XPath là gì?

Bạn có thể sử dụng bộ chọn CSS, nhận dạng hình ảnh hoặc bộ định vị Selenium tích hợp để thay thế cho XPath. Bộ chọn CSS là phổ biến nhất; bạn có thể tìm thấy các phần tử dựa trên tên thẻ, id hoặc lớp của chúng. Nhận dạng hình ảnh cho phép bạn định vị các mục dựa trên hình ảnh của chúng. Bộ định vị tích hợp của Selenium được thiết kế để dễ sử dụng.

Ứng dụng

Bây giờ bạn có thể xác định XPath trong Selenium, phân biệt giữa XPath tuyệt đối và tương đối, đồng thời định vị các phần tử bằng cách sử dụng các bộ định vị XPath khác nhau. Việc lựa chọn công cụ định vị sẽ phụ thuộc vào bản chất của nội dung và mục tiêu cuối cùng.

Hãy xem bài viết của chúng tôi về Câu hỏi phỏng vấn Selenium nếu bạn muốn vượt qua cuộc phỏng vấn tiếp theo.

Mục lục