Phần tử Web trong Selenium: Bản vănBox, Nút, phím gửi(), nhấp chuột()

Bởi: Krishna rừng ta Krishna rừng ta
Hours cập nhật

Phần tử Web trong Selenium

Biểu mẫu là các thành phần web cơ bản để nhận thông tin từ khách truy cập trang web. Biểu mẫu web có các thành phần GUI khác nhau như Hộp văn bản, Trường mật khẩu, Hộp kiểm, Nút radio, danh sách thả xuống, đầu vào tệp, v.v.

Chúng ta sẽ xem cách truy cập các phần tử biểu mẫu khác nhau này bằng cách sử dụng Selenium Trình điều khiển Web với Java. Selenium đóng gói mọi phần tử biểu mẫu dưới dạng đối tượng của WebElement. Nó cung cấp API để tìm các phần tử và thực hiện hành động trên chúng như nhập văn bản vào hộp văn bản, nhấp vào nút, v.v. Chúng ta sẽ xem các phương thức có sẵn để truy cập vào từng phần tử biểu mẫu.

Giới thiệu về WebElement, findElement(), findElements()

Selenium Web Driver đóng gói một phần tử biểu mẫu đơn giản làm đối tượng của Phần tử Web.

Có nhiều kỹ thuật khác nhau để WebDriver xác định các thành phần biểu mẫu dựa trên các thuộc tính khác nhau của các thành phần Web như ID, Tên, Lớp, XPath, Tên thẻ, Bộ chọn CSS, Văn bản liên kết, v.v.

Web Driver cung cấp hai phương thức WebElement sau để tìm các phần tử.

  • tìm phần tử() – tìm thấy một phần tử web duy nhất và trả về dưới dạng WebElement Selenium vật.
  • tìmElements() – trả về danh sách các đối tượng WebElement phù hợp với tiêu chí định vị.

Hãy xem đoạn mã để lấy một phần tử duy nhất – Trường văn bản trong trang web làm đối tượng của WebElement bằng phương thức findElement(). Chúng ta sẽ đề cập đến phương pháp findElements() để tìm nhiều phần tử trong các hướng dẫn tiếp theo.

Bước 1) Chúng ta cần nhập gói này để tạo các đối tượng của Web Elements

Giới thiệu về WebElement FindElement,FindElements

Bước 2) Chúng ta cần gọi phương thức findElement() có sẵn trên lớp WebDriver và lấy một đối tượng của WebElement.

Hãy tham khảo bên dưới để biết nó được thực hiện như thế nào.

NHỮNG BÀI VIẾT LIÊN QUAN

Selenium Nhập ký tự

Hộp nhập liệu đề cập đến một trong hai loại sau:

  1. Trường văn bản– Selenium hộp văn bản đầu vào chấp nhận các giá trị đã nhập và hiển thị chúng theo nguyên trạng.
  2. Trường mật khẩu– hộp văn bản chấp nhận các giá trị đã nhập nhưng che chúng dưới dạng một chuỗi ký tự đặc biệt (thường là dấu chấm và dấu hoa thị) để tránh hiển thị các giá trị nhạy cảm.

    Selenium Nhập ký tự

Bộ định vị

Phương thức findElement() lấy một tham số làm định vị cho phần tử. Các trình định vị khác nhau như By.id(), By.name(), By.xpath(), By.CSSSelector(), v.v. định vị các thành phần trong trang bằng cách sử dụng các thuộc tính của chúng như “““ id, tên hoặc đường dẫn, v.v.

Bạn có thể sử dụng các plugin như Fire path để nhận trợ giúp về việc lấy id, xpath, v.v. của các phần tử.

Sử dụng trang web mẫu https://demo.guru99.com/test/login.html dưới đây là mã để xác định vị trí trường văn bản “Địa chỉ email” bằng cách sử dụng trình định vị id và trường “Mật khẩu” bằng cách sử dụng trình định vị tên.

Bộ định vị

  1. Trường văn bản email được định vị theo Id
  2. Trường mật khẩu được đặt theo tên

phím gửi trong Selenium

phím gửi() trong Selenium là phương pháp được sử dụng để nhập nội dung có thể chỉnh sửa vào các trường văn bản và mật khẩu trong quá trình thực hiện kiểm tra. Các trường này được xác định bằng các định vị như tên, lớp, id, v.v. Đây là phương pháp có sẵn trên phần tử web. Không giống như phương pháp type, phương pháp sendkeys() không thay thế văn bản hiện có trong bất kỳ hộp văn bản nào.

Cách nhập văn bản vào Selenium

Để nhập văn bản vào Trường văn bản và Trường mật khẩu, sendKeys() là phương thức có sẵn trên WebElement trong Selenium.

Sử dụng cùng một ví dụ về https://demo.guru99.com/test/login.html trang web, đây là cách chúng tôi tìm trường Văn bản và trường Mật khẩu và nhập văn bản vào Selenium.

Văn bản trong Selenium

  1. Tìm trường văn bản “Địa chỉ email” bằng cách sử dụng trình định vị id.
  2. Tìm trường “Mật khẩu” bằng công cụ định vị tên
  3. Nhập văn bản vào “Địa chỉ email” bằng cách sử dụng Selenium phương pháp sendkey.
  4. Nhập mật khẩu vào trường “Mật khẩu” bằng phương thức sendKeys().

Xóa giá trị trong đầu vào Boxes

thông thoáng() phương pháp này được sử dụng để xóa văn bản trong hộp nhập liệu. Phương pháp này không cần tham số. Đoạn mã dưới đây sẽ xóa văn bản khỏi các trường Email hoặc Mật khẩu

Xóa giá trị trong đầu vào Boxes

Selenium Bấm vào nút

Selenium nút bấm có thể được truy cập bằng phương thức click().

Trong ví dụ trên

  1. Tìm nút để đăng nhập
  2. Nhấp vào nút “Đăng nhập” trong trang đăng nhập của trang web để đăng nhập vào trang web.

Selenium Bấm vào nút

Selenium Nút gửi

Nút gửi được sử dụng để gửi toàn bộ biểu mẫu đến máy chủ. Chúng ta có thể sử dụng phương thức click () trên thành phần web giống như một nút thông thường như chúng ta đã làm ở trên hoặc sử dụng phương thức submit () trên bất kỳ thành phần web nào trong biểu mẫu hoặc trên chính nút gửi.

Selenium Nút gửi

Khi submit() được sử dụng, WebDriver sẽ tra cứu DOM để biết phần tử thuộc về dạng nào và sau đó kích hoạt chức năng gửi của nó.

Hoàn thành mã

Đây là mã làm việc hoàn chỉnh

import org.openqa.selenium.By;		
import org.openqa.selenium.WebDriver;		
import org.openqa.selenium.chrome.ChromeDriver;		
import org.openqa.selenium.*;		

public class Form {				
    public static void main(String[] args) {									
    		
    	// declaration and instantiation of objects/variables		
        System.setProperty("webdriver.chrome.driver","G:\\chromedriver.exe");					
        WebDriver driver = new ChromeDriver();					
        		
        String baseUrl = "https://demo.guru99.com/test/login.html";					
        driver.get(baseUrl);					

        // Get the WebElement corresponding to the Email Address(TextField)		
        WebElement email = driver.findElement(By.id("email"));							

        // Get the WebElement corresponding to the Password Field		
        WebElement password = driver.findElement(By.name("passwd"));							

        email.sendKeys("abcd@gmail.com");					
        password.sendKeys("abcdefghlkjl");					
        System.out.println("Text Field Set");					
         
        // Deleting values in the text box		
        email.clear();			
        password.clear();			
        System.out.println("Text Field Cleared");					

        // Find the submit button		
        WebElement login = driver.findElement(By.id("SubmitLogin"));							
                    		
        // Using click method to submit form		
        email.sendKeys("abcd@gmail.com");					
        password.sendKeys("abcdefghlkjl");					
        login.click();			
        System.out.println("Login Done with Click");					
        		
        //using submit method to submit the form. Submit used on password field		
        driver.get(baseUrl);					
        driver.findElement(By.id("email")).sendKeys("abcd@gmail.com");							
        driver.findElement(By.name("passwd")).sendKeys("abcdefghlkjl");							
        driver.findElement(By.id("SubmitLogin")).submit();					
        System.out.println("Login Done with Submit");					
         
		//driver.close();		
        		
    }		
}

Xử lý sự cố

Nếu bạn gặp phải NoSuchElementException() trong khi tìm phần tử, điều đó có nghĩa là phần tử đó không được tìm thấy trong trang tại thời điểm trình điều khiển Web truy cập trang.

  1. Kiểm tra lại công cụ định vị của bạn bằng Firepath hoặc Kiểm tra phần tử trong Chrome.
  2. Kiểm tra xem giá trị bạn sử dụng trong mã có khác với giá trị cho phần tử trong Firepath hiện tại hay không.
  3. Một số thuộc tính là động đối với một số phần tử. Trong trường hợp bạn thấy giá trị khác nhau và thay đổi động, hãy cân nhắc sử dụng By.xpath() hoặc By.cssSelector() là những cách đáng tin cậy hơn nhưng phức tạp hơn.
  4. Đôi khi, đó cũng có thể là vấn đề chờ đợi, tức là trình điều khiển Web đã thực thi mã của bạn ngay cả trước khi trang được tải hoàn toàn, v.v.
  5. Thêm thời gian chờ trước findElement() bằng cách sử dụng thời gian chờ tiềm ẩn hoặc rõ ràng.

Tổng kết

  • Bảng dưới đây tóm tắt các lệnh để truy cập từng loại phần tử đã thảo luận ở trên
Yếu tố Lệnh Mô tả
Đầu vào Box sendKeys() được sử dụng để nhập giá trị vào hộp văn bản
thông thoáng() được sử dụng để xóa hộp văn bản khỏi giá trị hiện tại của nó
Liên kết nhấp chuột() được sử dụng để nhấp vào liên kết và đợi tải trang hoàn tất trước khi chuyển sang lệnh tiếp theo.
Gửi nút Gửi đi()
  • WebDriver cho phép lựa chọn nhiều tùy chọn trong nhiều phần tử CHỌN.
  • Bạn có thể sử dụng phương thức submit() trên bất kỳ phần tử nào trong biểu mẫu. WebDriver sẽ tự động kích hoạt chức năng gửi của biểu mẫu chứa phần tử đó.

Bạn có thể thích: