Bộ chọn css trong selen
Bài viết này sẽ thảo luận và mô tả, với các ví dụ, cách người ta có thể sử dụng các bộ CSS được chọn để xác định các yếu tố cấu thành web trong các lần thử nghiệm. Nó cũng sẽ mô tả Bộ chọn CSS Cú pháp trong Selenium Show
Nội dung chính Hiển thị
Nên có sự hiểu biết sâu sắc hơn về các định vị trong selen trước khi kéo nó xuống các bộ chọn CSS nói riêng CSS select is what?Về cơ bản, bộ chọn CSS kết hợp bộ chọn phần tử và giá trị bộ chọn có thể xác định các phần tử có thể trên trang web. Giống như XPath, bộ chọn CSS có thể được sử dụng để xác định vị trí của các phần tử web mà không cần ID, Lớp hoặc tên. Bộ chọn CSS kết hợp bộ chọn phần tử và giá trị bộ chọn có thể xác định các phần tử cụ thể trên trang web. Giống như XPath, bộ chọn CSS có thể được sử dụng để định vị các phần tử web không có ID, lớp hoặc Tên Các loại bộ chọn CSS (có ví dụ)Có 5 loại bộ CSS được chọn trong các bài kiểm tra được chọn-
1. TÔITrong ví dụ này, tập lệnh sẽ truy cập hộp văn bản email trên biểu mẫu đăng nhập tại gmail. hộp văn bản comEmail trên biểu mẫu đăng nhập tại Gmail. com Hộp văn bản mang thuộc tính ID với giá trị Email Email. Trong trường hợp này, thuộc tính ID và giá trị của nó được sử dụng để tạo bộ chọn CSS cho phép truy cập vào hộp văn bản Cách tạo bộ chọn Selenium CSS cho phần tử web Xác định vị trí phần tử web - Hộp văn bản email. Thẻ HTML ở đây là đầu vào và giá trị của ID thuộc tính là email email. Kết hợp, họ đề cập đến hộp văn bản email. Đây là dữ liệu cần thiết để tạo bộ chọn CSS. Thẻ HTML ở đây là “đầu vào” và giá trị của thuộc tính ID là “Email”. Kết hợp lại, chúng đề cập đến hộp văn bản Email. Đây là dữ liệu cần thiết để tạo bộ chọn CSS Nguồn hình ảnh Xác định giá trị định vị Loại CSS CSS = đầu vào#Email (giá trị định vị) trong selen ide. Click vào nút Find. Hộp văn bản email được sáng, xác minh giá trị định vị. css=input#Email”(giá trị định vị) trong Selenium IDE. Bấm vào nút Tìm. Hộp văn bản Email được tô sáng, xác minh giá trị định vị Nguồn hình ảnh Xác định giá trị định vị css=<#>
#. Được sử dụng để biểu tượng ID thuộc tính. Lưu ý rằng trùm bị bắt buộc trong trường hợp thuộc tính ID được sử dụng để tạo bộ chọn CSS. css=” Giá trị của ID thuộc tính. Giá trị của ID thuộc tính được truy cập. Giá trị này luôn luôn đi trước mũ. Nếu nhiều phần tử web có cùng giá trị thuộc tính và thẻ HTML, thì phần tử đầu tiên được đánh dấu trong nguồn trang sẽ được xác định Khi chỉ chọn bộ CSS trong hộp văn bản đích của Selenium IDE, hãy đảm bảo rằng nó đã được CSS đi trước CSS =. LớpLưu ý. Nếu nhiều phần tử web có cùng một thẻ HTML và giá trị thuộc tính, thì phần tử đầu tiên được đánh dấu trong nguồn trang sẽ được xác định. Hộp kiểm “Duy trì trạng thái đăng nhập” xuất hiện bên dưới biểu mẫu đăng nhập tại Gmail. com 2. Thuộc tính lớp có giá trị “ghi nhớ”. Thuộc tính và giá trị Lớp này có thể được sử dụng để tạo bộ chọn CSS truy cập phần tử web đã chọn Trong ví dụ này, tập lệnh sẽ truy cập vào hộp kiểm có chữ ký của Wikipedia xuất hiện bên dưới biểu mẫu đăng nhập tại gmail. com Hộp kiểm mang thuộc tính lớp với giá trị bộ nhớ. Thuộc tính và giá trị lớp này có thể được sử dụng để tạo bộ chọn CSS truy cập vào phần tử web đã chọn. Trong trường hợp này, thẻ HTML là “nhãn” và giá trị của thuộc tính ID là “nhớ”. Kết hợp lại, chúng đề cập đến hộp kiểm “Duy trì trạng thái đăng nhập” Xác định giá trị định vị Loại CSS CSS = đầu vào#Email (giá trị định vị) trong selen ide. Click vào nút Find. Hộp văn bản email được sáng, xác minh giá trị định vị. css=nhãn. ghi nhớ”(giá trị định vị) trong Selenium IDE. Bấm vào nút Tìm. Hộp kiểm “Duy trì trạng thái đăng nhập” được tô sáng, xác minh giá trị của bộ định vị Nguồn hình ảnh Xác định giá trị định vị css=<.>
Cú pháp Cách xử lý lớp Action trong Selenium Thẻ HTML. Có thể sử dụng để biểu thị phần web được truy cậpAttribute#. Được sử dụng để biểu tượng ID thuộc tính. Lưu ý rằng trùm bị bắt buộc trong trường hợp thuộc tính ID được sử dụng để tạo bộ chọn CSS. Nút “Đăng nhập” nằm bên dưới biểu mẫu đăng nhập tại Gmail. com Giá trị của ID thuộc tính. Giá trị của ID thuộc tính được truy cập. Giá trị này luôn luôn đi trước mũ. loại thuộc tính với giá trị "gửi". Thuộc tính loại này và giá trị của nó có thể được sử dụng để tạo Bộ chọn CSS sẽ truy cập phần tử web ưa thích Khi chỉ chọn bộ CSS trong hộp văn bản đích của Selenium IDE, hãy đảm bảo rằng nó đã được CSS đi trước CSS = Lưu ý. Nếu nhiều phần tử web có cùng một thẻ HTML và giá trị thuộc tính, thì phần tử đầu tiên được đánh dấu trong nguồn trang sẽ được xác định. Thẻ HTML trong trường hợp này là “input”, thuộc tính là type và giá trị của thuộc tính là “submit”. Kết hợp lại, chúng đề cập đến nút “Đăng nhập” Xác định giá trị định vị Loại CSS CSS = đầu vào#Email (giá trị định vị) trong selen ide. Click vào nút Find. Hộp văn bản email được sáng, xác minh giá trị định vị. css=input[type=’submit’]” (giá trị định vị) trong Selenium IDE. Bấm vào nút Tìm. Nút “Đăng nhập” sẽ được tô sáng, xác minh giá trị của bộ định vị Nguồn hình ảnh Xác định giá trị định vị css=<[attribute=Value of attribute]>
Thẻ HTML. Có thể sử dụng để biểu thị phần tử web được truy cập Bạn muốn tìm hiểu sâu hơn về triển khai Selenium trên BrowserStack với các khóa học tương tác và bài tập trong phòng thí nghiệm miễn phí?Visit Test University #. Được sử dụng để biểu tượng ID thuộc tính. Lưu ý rằng trùm bị bắt buộc trong trường hợp thuộc tính ID được sử dụng để tạo bộ chọn CSSGiá trị của ID thuộc tính. Giá trị của ID thuộc tính được truy cập. Giá trị này luôn luôn đi trước mũ Khi chỉ chọn bộ CSS trong hộp văn bản đích của Selenium IDE, hãy đảm bảo rằng nó đã được CSS đi trước CSS =
Hộp kiểm mang thuộc tính lớp với giá trị bộ nhớ. Thuộc tính và giá trị lớp này có thể được sử dụng để tạo bộ chọn CSS truy cập vào phần tử web đã chọn Đây là cách tạo bộ chọn CSS cho web phần tử cú pháp css=<[attribute^=prefix of the string]>
Nếu một người có ý định xác nhận hộp văn bản mật khẩu, thì bộ chọn CSS, trong trường hợp này, sẽ là. “Hộp văn bản mật khẩu”, Bộ chọn CSS, trong trường hợp này, sẽ là css=input#Passwd[name^='Pass'] Khớp với một hậu tố Mục đích của điều này là tương ứng với chuỗi bằng cách sử dụng một hậu tố phù hợp cú pháp css=<[attribute$=suffix of the string]>
Một lần nữa, nếu một người có ý định xác định hộp văn bản mật khẩu của Google, thì bộ chọn CSS, trong trường hợp này sẽ là. “Hộp văn bản mật khẩu”, Bộ chọn CSS, trong trường hợp này sẽ là css=input#Passwd[name$='wd'] Kết hợp một chuỗi con Mục đích của điều này là tương ứng với chuỗi bằng cách sử dụng một chuỗi phù hợp cú pháp css=<[attribute*=sub string]>
Một lần nữa, nếu một người có ý định xác định hộp văn bản mật khẩu, thì bộ chọn CSS tương ứng sẽ là. hộp văn bản mật khẩu”, Bộ chọn CSS tương ứng sẽ là css=input#Passwd[name$='wd'] Read direction. Các bước để tự động hóa đăng nhập bằng Selenium WebDriver Các bước để tự động hóa đăng nhập bằng Selenium WebDriver 5. Văn bản bên trongSử dụng văn bản bên trong giúp xác định và tạo các bộ chọn CSS trong Selenium WebDriver bằng cách sử dụng một chuỗi mẫu có thẻ HTML biểu hiện trên trang web. Cơ chế này được sử dụng thường xuyên nhất để định vị các yếu tố web trên tài khoản của cú pháp đơn giản hóa của nó Trong ví dụ này, hãy tập trung vào email Quên? . com Thẻ tân đại diện cho siêu liên kết này có một số văn bản trong đó. Văn bản này có thể được sử dụng để tạo bộ chọn CSS định vị phần tử web cần thiết cú pháp css=<:>
Đó là một kỹ năng hữu ích để tìm một yếu tố của các bộ CSS được chọn, đặc biệt là vì nó được sử dụng bởi các nhà phát triển và người dùng thử nâng cao. Bằng cách làm chủ nó, người ta có thể sử dụng selen cho toàn bộ tiềm năng của mình, làm điều đó Tối ưu hóa khả năng của nó để kiểm tra selen tự động Chạy kiểm tra tự động miễn phí CSS select is what?Bộ chọn CSS là phần đầu tiên của quy tắc CSS. Đó là một mẫu của các phần tử và các thuật ngữ khác để trình duyệt biết các phần tử HTML nên được chọn để có các giá trị thuộc tính CSS bên trong quy tắc được áp dụng cho chúng tôi. phần đầu tiên của Quy tắc CSS . Đó là một mẫu các phần tử và các thuật ngữ khác cho trình duyệt biết phần tử HTML nào sẽ được chọn để có các giá trị thuộc tính CSS bên trong quy tắc được áp dụng cho chúng. CSS select and type of it is what?Bộ chọn CSS được sử dụng để "tìm" (hoặc chọn) các phần tử HTML bạn muốn tạo kiểu. Chúng ta có thể chia các bộ chọn CSS thành các loại loại. Bộ chọn đơn giản (chọn các phần tử dựa trên tên, ID, lớp) Bộ chọn tổ hợp (chọn các phần tử dựa trên mối quan hệ cụ thể giữa chúng) dùng để "tìm" . Chúng tôi có thể chia bộ chọn CSS thành năm loại. Bộ chọn đơn giản (chọn các phần tử dựa trên tên, id, lớp) Bộ chọn kết hợp (chọn các phần tử dựa trên mối quan hệ cụ thể giữa chúng). We can divide CSS selectors into five categories: Simple selectors (select elements based on name, id, class) Combinator selectors (select elements based on a specific relationship between them) Một ví dụ về bộ chọn trong CSS là gì?Element section. Bộ chọn phần tử chọn các phần tử HTML dựa trên tên phần tử (hoặc thẻ) ví dụ P, H1, Div, Span, v. v. phong cách. CSS. Mã sau được sử dụng trong mã HTML ở trên. Bạn có thể thấy các quy tắc CSS được áp dụng cho tất cả các thẻ và thẻ |