Trong hướng dẫn Selenium WebDriver này, tôi sẽ xem cách xử lý một bảng web trong Selenium cùng với một vài thao tác hữu ích có thể được thực hiện trên các bảng web. Khi kết thúc hướng dẫn này, bạn sẽ hiểu thấu đáo về các bảng web trong tự động hóa thử nghiệm Selenium cùng với các phương pháp được sử dụng để truy cập nội dung trong bảng web. Để biết thêm về Selenium là gì, bạn có thể tham khảo trang chi tiết của chúng tôi về chủ đề này
Dưới đây là các chủ đề phụ được đề cập như một phần của hướng dẫn Selenium WebDriver này
Bảng Web trong Selenium là gì?
Bảng web trong Selenium là một WebElement giống như bất kỳ WebElement phổ biến nào khác như hộp văn bản, nút radio, hộp kiểm, menu thả xuống, v.v. Bảng Web và nội dung của nó có thể được truy cập bằng cách sử dụng các hàm WebElement cùng với bộ định vị Selenium để xác định phần tử [hàng/cột] mà thao tác cần được thực hiện trên đó
Một bảng bao gồm các hàng và cột. Bảng được tạo cho một trang web được gọi là bảng web. Dưới đây là một số thẻ quan trọng được liên kết với bảng web
- < table > – Định nghĩa một bảng HTML
- < th > – Chứa thông tin tiêu đề trong bảng
- < tr > – Xác định một hàng trong bảng
- < td > – Định nghĩa một cột trong bảng
Các loại bảng Web trong Selenium
Có hai loại bảng lớn là
Bảng web tĩnh
Như tên cho thấy, thông tin trong bảng có bản chất tĩnh
Bảng web động
Thông tin hiển thị trong bảng là thông tin động. e. g. Thông tin chi tiết Sản phẩm trên website thương mại điện tử, báo cáo bán hàng, v.v.
Để trình diễn cách xử lý bảng trong Selenium, chúng tôi sử dụng một bảng có sẵn trong trang bảng HTML của w3school. Mặc dù có ít sự cố kiểm tra trình duyệt chéo hơn khi sử dụng bảng nhưng một số trình duyệt Internet Explorer, Chrome và các trình duyệt web khác không hỗ trợ API bảng HTML
Bây giờ chúng ta đã trình bày những điều cơ bản, tiếp theo trong hướng dẫn Selenium WebDriver này, tôi sẽ xem xét một số thao tác thường được sử dụng để xử lý các bảng trong Selenium sẽ giúp ích cho các nỗ lực tự động hóa thử nghiệm Selenium của bạn
Chứng nhận này dành cho bất kỳ ai muốn dẫn đầu trong số các chuyên gia đang phát triển sự nghiệp của họ trong thử nghiệm tự động hóa Selenium
Dưới đây là thông tin sơ lược về chứng nhận Selenium 101 từ LambdaTest
Xử lý bảng web trong Selenium
Tôi sẽ sử dụng Selenium WebDriver cục bộ để thực hiện các tác vụ của trình duyệt nhằm xử lý bảng trong Selenium, trình bày trên trang bảng html của w3schools. Mã HTML cho bảng web được sử dụng để trình diễn có sẵn trong trang bộ điều hợp tryit
Có thể tải xuống Selenium WebDriver cho các trình duyệt phổ biến từ các vị trí được đề cập bên dưới
Tôi sẽ sử dụng framework unittest của Python để xử lý các bảng trong. Logic cốt lõi để truy cập các phần tử trong bảng web vẫn giữ nguyên ngay cả khi bạn đang sử dụng các ngôn ngữ lập trình khác để tự động kiểm tra Selenium
Lưu ý – Việc triển khai trong setUp[] và teardown[] vẫn giữ nguyên cho tất cả các tình huống. Chúng tôi sẽ không lặp lại phần đó trong mọi ví dụ được hiển thị trong blog
Xử lý số hàng & cột trong bảng web
Thẻ < tr > trong bảng chỉ ra các hàng trong bảng và thẻ đó dùng để lấy thông tin về số hàng trong đó. Số cột của bảng web trong Selenium được tính bằng XPath [//*[@id=’customers’]/tbody/tr[2]/td]. XPath của các hàng và cột được lấy bằng công cụ kiểm tra trong trình duyệt để xử lý các bảng trong Selenium để kiểm tra trình duyệt tự động
Mặc dù tiêu đề trong bảng web không phải là < td >, thẻ < th > vẫn có thể được sử dụng trong ví dụ hiện tại để tính số lượng cột. XPath để tính toán số lượng cột sử dụng thẻ < th > là //*[@id=’customers’]/tbody/tr/th
WebDriverWait trong 30 giây được thêm vào để đảm bảo rằng quá trình tải Bảng Web [CLASS_NAME = w3-example] hoàn tất trước khi bất kỳ thao tác nào được thực hiện để xử lý bảng trong Selenium
Nhận số hàng cho một bảng web trong Selenium
num_rows = len[trình điều khiển. find_elements_by_xpath["//*[@id='customers']/tbody/tr"]]
Nhận số cột cho bảng web trong Selenium
num_cols = len[trình điều khiển. find_elements_by_xpath["//*[@id='customers']/tbody/tr[2]/td"]]
hoàn thành thực hiện
Dưới đây là ảnh chụp đầu ra
In nội dung của bảng web trong Selenium
Để truy cập nội dung có trong mỗi hàng và cột để xử lý bảng trong Selenium, chúng tôi lặp lại từng hàng [< tr >] trong bảng web. Sau khi có được thông tin chi tiết về các hàng, chúng tôi lặp lại các thẻ < td > bên dưới hàng đó
Trong trường hợp này đối với hướng dẫn Selenium WebDriver này, cả hàng [< tr >] và cột [_______1_______] đều có thể thay đổi. Do đó, số hàng và số cột được tính động. Hiển thị bên dưới là XPath để truy cập thông tin trong các hàng và cột cụ thể
- XPath để truy cập Hàng. 2, Cột. 2 – //*[@id=”customers”]/tbody/tr[2]/td[1]
- XPath để truy cập Hàng. 3, Cột. 1 – //*[@id=”customers”]/tbody/tr[3]/td[1]
Bảng mà Selenium test automation đang được thực hiện có 7 hàng và 3 cột. Do đó, một vòng lặp for lồng nhau được thực thi với các hàng nằm trong khoảng từ 2. 7 và các cột từ 1. 4. Các yếu tố biến i. e. số hàng và số cột được thêm vào để tạo XPath cuối cùng
cho t_row trong phạm vi [2, [hàng + 1]]
cho t_column trong phạm vi [1, [cột + 1]]
FinalXPath = before_XPath + str[t_row] + aftertd_XPath + str[t_column] + aftertr_XPath
cell_text = trình điều khiển. find_element_by_xpath[FinalXPath]. chữ
Hiển thị bên dưới trong hướng dẫn Selenium WebDriver này, là cách triển khai hoàn chỉnh để lấy tất cả nội dung hiện có để xử lý bảng trong Selenium
Ảnh chụp nhanh đầu ra để in nội dung để xử lý bảng trong Selenium bên dưới
Đọc dữ liệu theo hàng để xử lý bảng trong Selenium
Để truy cập nội dung có trong mỗi hàng, để xử lý bảng trong Selenium, các hàng [< tr >] có thể thay đổi trong khi các cột [< td >] sẽ không đổi. Do đó, các hàng được tính toán động. Dưới đây trong hướng dẫn Selenium WebDriver này là XPath để truy cập thông tin với các hàng là hệ số biến và các cột không đổi để tự động kiểm tra Selenium
- XPath để truy cập Hàng. 1, Cột. 1 – //*[@id=”customers”]/tbody/tr[1]/td[1]
- XPath để truy cập Hàng. 2, Cột. 2 – //*[@id=”khách hàng”]/tbody/tr[2]/td[2]
- XPath để truy cập Hàng. 3, Cột. 2 – //*[@id=”khách hàng”]/tbody/tr[3]/td[2]
Một vòng lặp for được thực hiện với các hàng nằm trong khoảng từ 2. 7. Các giá trị cột được thêm vào XPath là td[1]/td[2]/td[3] tùy thuộc vào hàng & cột phải được truy cập để xử lý bảng trong Selenium
before_XPath = "//*[@id='customers']/tbody/tr["
aftertd_XPath_1 = "]/td[1]"
aftertd_XPath_2 = "]/td[2]"
aftertd_XPath_3 = "]/td[3]"
cho t_row trong phạm vi [2, [hàng + 1]]
FinalXPath = before_XPath + str[t_row] + aftertd_XPath_1
cell_text = trình điều khiển. find_element_by_xpath[FinalXPath]. chữ
hoàn thành thực hiện
Ảnh chụp nhanh đầu ra để đọc dữ liệu theo hàng để xử lý bảng trong Selenium bên dưới
Đọc dữ liệu trong cột để xử lý bảng trong Selenium
Để truy cập theo cột để xử lý bảng trong Selenium, các hàng không đổi trong khi số cột là biến i. e. các cột được tính toán động. Bên dưới trong Hướng dẫn Selenium WebDriver này là XPath để truy cập thông tin trong đó các cột là biến và các hàng là hằng số
- XPath để truy cập Hàng. 2, Cột. 2 – //*[@id=”khách hàng”]/tbody/tr[2]/td[2]
- XPath để truy cập Hàng. 2, Cột. 3 – //*[@id=”khách hàng”]/tbody/tr[2]/td[3]
- XPath để truy cập Hàng. 2, Cột. 4 – //*[@id=”khách hàng”]/tbody/tr[2]/td[4]
Một vòng lặp for được thực hiện với các cột nằm trong khoảng từ 1. 4 Các giá trị hàng được thêm vào XPath là tr[1]/tr[2]/tr[3] tùy thuộc vào hàng & cột phải được truy cập
before_XPath_1 = "//*[@id='customers']/tbody/tr[1]/th["
before_XPath_2 = "//*[@id='customers']/tbody/tr[2]/td["
cho t_col trong phạm vi [1, [num_columns + 1]]
FinalXPath = before_XPath_1 + str[t_col] + after_XPath
cell_text = trình điều khiển. find_element_by_xpath[FinalXPath]. chữ
hoàn thành thực hiện
Như đã thấy trong ảnh chụp thực thi, cột tiêu đề cũng được đọc để lấy tiêu đề của các cột
Mục đích của thử nghiệm này cho hướng dẫn Selenium WebDriver này là tìm kiếm sự hiện diện của một phần tử trong bảng web. Để làm điều tương tự, nội dung trong từng ô của bảng web được đọc và so sánh với cụm từ tìm kiếm. Nếu có phần tử, hàng và phần tử tương ứng sẽ được in ra để xử lý bảng trong Selenium
Vì nó liên quan đến việc đọc dữ liệu trong mọi ô, chúng tôi sử dụng logic được trình bày trong phần có tiêu đề In nội dung của bảng web trong Selenium. Tìm kiếm không phân biệt chữ hoa chữ thường được thực hiện để xác thực sự hiện diện của cụm từ tìm kiếm để xử lý bảng trong Selenium
cho t_row trong phạm vi [2, [num_rows + 1]]
cho t_column trong phạm vi [1, [num_columns + 1]]
FinalXPath = before_XPath + str[t_row] + aftertd_XPath + str[t_column] + aftertr_XPath
cell_text = trình điều khiển. find_element_by_xpath[FinalXPath]. chữ
nếu [[ô_văn bản. casefold[]] == [search_text. trường hợp gấp[]]]
print["Văn bản tìm kiếm " + văn bản_tìm kiếm +" có ở hàng " + str[t_row] + " và cột " + str[t_column]]
hoàn thành thực hiện
Như đã thấy trong ảnh chụp thực thi cho hướng dẫn Selenium WebDriver này, thuật ngữ tìm kiếm đã có ở hàng-7 và cột-1
Mặc dù có nhiều thao tác như vậy có thể được thực hiện trên bảng web trong Selenium, nhưng chúng tôi đã đề cập đến các khía cạnh cốt lõi trong hướng dẫn Selenium WebDriver này
Đọc thêm. Cách tự động hóa lịch trong Selenium WebDriver để kiểm tra tự động hóa?
Tất cả trong tất cả
Bảng web thường được sử dụng khi thông tin phải được hiển thị ở định dạng bảng. Thông tin trong các ô có thể là tĩnh hoặc động. Các bảng web trong Selenium được kiểm tra bằng API WebElement cùng với việc sử dụng các bộ định vị thích hợp như XPath, tên lớp CSS, ID CSS, v.v.
Tôi hy vọng bạn thích hướng dẫn Selenium WebDriver này để xử lý bảng trong Selenium. Hãy để lại suy nghĩ của bạn về việc sử dụng các bảng web trong tự động kiểm tra Selenium trong phần bình luận bên dưới. Hãy chia sẻ nó với các đồng nghiệp của bạn. Đến lúc đó. Kiểm tra vui vẻ. ?