Hướng dẫn can selenium execute javascript? - selen có thể thực thi javascript không?

Selenium WebDriver cho phép bạn giao tiếp với các trình duyệt khác nhau để thực hiện các lệnh và xác nhận trên các phần tử DOM.Tuy nhiên, có những trường hợp mà các lệnh Webdriver thực tế sẽ không hoạt động hiệu quả như mong đợi. Đây là lúc JavaScriptExecutor xuất hiện bổ trợ cho chúng ta. cho phép bạn giao tiếp với các trình duyệt khác nhau để thực hiện các lệnh và xác nhận trên các phần tử DOM.Tuy nhiên, có những trường hợp mà các lệnh Webdriver thực tế sẽ không hoạt động hiệu quả như mong đợi. Đây là lúc JavaScriptExecutor xuất hiện bổ trợ cho chúng ta.

Trong bài viết này, chúng ta sẽ thảo luận về JavaScriptExecutor trong Selenium WebDriver. Cách khai báo, cách sử dụng JavaScriptExecutor trong Selenium. Chúng ta sẽ đi sâu hơn vào việc triển khai và khám phá các hàm khác nhau trong JavascriptExecutor cùng với các ví dụ thực tế.JavaScriptExecutor trong Selenium WebDriver. Cách khai báo, cách sử dụng JavaScriptExecutor trong Selenium. Chúng ta sẽ đi sâu hơn vào việc triển khai và khám phá các hàm khác nhau trong JavascriptExecutor cùng với các ví dụ thực tế.

JavaScriptExecutor trong Selenium là gì?

JavaScriptExecutor là một giao diện được cung cấp bởi Selenium Webdriver, trình bày cách thực thi JavaScript từ Webdriver. Giao diện này cung cấp các phương pháp để chạy JavaScript trên cửa sổ đã chọn hoặc trang hiện tại. JavaScriptExecutor là một giao diện có sẵn cho tất cả các ngôn ngữ hỗ trợ Selenium Framework . là một giao diện được cung cấp bởi Selenium Webdriver, trình bày cách thực thi JavaScript từ Webdriver. Giao diện này cung cấp các phương pháp để chạy JavaScript trên cửa sổ đã chọn hoặc trang hiện tại. JavaScriptExecutor là một giao diện có sẵn cho tất cả các ngôn ngữ hỗ trợ Selenium Framework .

Vì JavaScriptExecutor là một giao diện Selenium, nên không cần thêm plugin hoặc tiện ích bổ sung. Bạn có thể sử dụng nó trực tiếp bằng cách nhập gói 

JavascriptExecutor js = (JavascriptExecutor) driver;

js.executeScript​(java.lang.String script, java.lang.Object... args)

Tại sao sử dụng JavaScriptExecutor trong Selenium?

Riêng Selenium Webdriver cho phép bạn thực hiện các thao tác trên các phần tử web như gửi dữ liệu, nhấp vào các nút, v.v. Tuy nhiên, như đã nói trước đây, có những trường hợp mà các lệnh của Webdriver sẽ không hoạt động như mong đợi do nhiều lý do khác nhau. Trong những trường hợp này, chúng tôi sẽ nhờ đến sự trợ giúp của JavaScriptExecutor.Selenium Webdriver cho phép bạn thực hiện các thao tác trên các phần tử web như gửi dữ liệu, nhấp vào các nút, v.v. Tuy nhiên, như đã nói trước đây, có những trường hợp mà các lệnh của Webdriver sẽ không hoạt động như mong đợi do nhiều lý do khác nhau. Trong những trường hợp này, chúng tôi sẽ nhờ đến sự trợ giúp của JavaScriptExecutor.

Ví dụ: theo truyền thống để xác định vị trí một phần tử web, chúng ta sử dụng các chiến lược định vị web khác nhau như ID, Tên, bộ chọn CSS và XPath, v.v. Nếu các trình định vị này không hoạt động như mong đợi hoặc bạn đang xử lý một XPath phức tạp, bạn có thể sử dụng JavaScriptExecutor để thực hiện thao tác mong muốn trên WebElement.

Trên các dòng tương tự, để nhấp vào WebElement, chúng ta thường sử dụng

js.executeScript​(java.lang.String script, java.lang.Object... args)

driver.findElement(By.id("button")).click();​

Đôi khi, phương thức

js.executeScript​(java.lang.String script, java.lang.Object... args)

Như chúng ta đã biết, các trình duyệt có triển khai Javascript bên trong chúng và có thể hiểu các lệnh JavaScript. Do đó, hiểu JavaScriptExecutor trong Selenium sẽ cho phép bạn thực hiện một loạt các hoạt động hiệu quả và thanh lịch hơn.

Giới thiệu về các phương thức JavaScriptExecutor

JavaScriptExecutor trong Selenium cung cấp hai phương pháp mà qua đó chúng ta có thể chạy JavaScript trên cửa sổ đã chọn hoặc trang hiện tại.

a) executeScript

Phương thức này thực thi JavaScript trong ngữ cảnh của cửa sổ hoặc khung hiện đang được chọn trong Selenium. Tập lệnh sẽ được thực thi dưới dạng phần thân của một hàm ẩn danh.

b) executeAsyncScript

Phương thức này thực thi một đoạn mã JavaScript không đồng bộ trong ngữ cảnh của cửa sổ hoặc khung hiện đang được chọn trong Selenium. Ở đây, tập lệnh sẽ được thực thi dưới dạng phần thân của một hàm ẩn danh. Sự khác biệt chính giữa executeScript và executeAsyncScript là tập lệnh được gọi bằng thực thi executeAsyncScript phải báo hiệu về việc hoàn thành thực thi bằng cách sử dụng hàm gọi lại.

Các phương thức gọi sử dụng executeAsyncScript chủ yếu được sử dụng khi chế độ ngủ phải được thực hiện trong trình duyệt đang thử nghiệm hoặc khi các thử nghiệm phải được đồng bộ hóa trong ứng dụng AJAX.

Cả hai phương pháp đều cho phép chúng tôi trả về một giá trị bằng cách sử dụng từ khóa

js.executeScript​(java.lang.String script, java.lang.Object... args)

js.executeScript​(java.lang.String script, java.lang.Object... args)

• Long
• String
• Boolean
• List
• WebElement

Cú pháp cơ bản của JavaScriptExecutor trong Selenium

Mục đích của phần này là cung cấp ý tưởng cấp cao về các bước triển khai của JavaScriptExecutor trong Selenium. Để chứng minh, chúng tôi đã sử dụng Java làm ngôn ngữ lập trình ưa thích.Để chứng minh, chúng tôi đã sử dụng Java làm ngôn ngữ lập trình ưa thích.

Chúng ta hãy xem xét các bước chính.

Bước 1: Import package JavascriptExecutor. Import package JavascriptExecutor.

import org.openqa.selenium.JavascriptExecutor;​

Bước 2: Bây giờ để sử dụng JavascriptExecutor, hãy tạo một tham chiếu cho giao diện và gán nó cho cá thể WebDriver với cú pháp: Bây giờ để sử dụng JavascriptExecutor, hãy tạo một tham chiếu cho giao diện và gán nó cho cá thể WebDriver với cú pháp:

JavascriptExecutor js = (JavascriptExecutor) driver;

Bước 3: Chúng ta đã tạo một tham chiếu JavascriptExecutor. Bây giờ chúng ta gọi các phương thức executeAsyncScript / executeScript. Cú pháp cho executeScript đượcthể hiện dưới đây: Chúng ta đã tạo một tham chiếu JavascriptExecutor. Bây giờ chúng ta gọi các phương thức executeAsyncScript / executeScript. Cú pháp cho executeScript đượcthể hiện dưới đây:

js.executeScript​(java.lang.String script, java.lang.Object... args)

Thông số:

script - JavaScript để thực thiargs - Các đối số của script. Có thể trống.Trả lại giá trị - JavaScript để thực thi
args - Các đối số của script. Có thể trống.Trả lại giá trị

Boolean / Long / Double/ String/ List / Map / WebElement / Null.

Các tình huống sử dụng JavaScriptExecutor trong Selenium

Một số tình huống chúng ta có thể xử lý bằng cách sử dụng Giao diện JavaScriptExecutor

1. Nhấp vào một Element

js.executeScript("document.getElementById('id_of_element').click();");
//hoặc
js.executeScript("arguments[0].click();", buttonLogin);

Khi mà Selenium nó báo là không thể tương tác hay không thể click vào một phần tử web nghĩa là có thể nó đang bị che hoặc chưa load lên UI kịp thời. Khi đó thằng Javascript này nó click dựa vào DOM nên nó không quan tâm bị che. Có ví dụ code chạy bên dưới.

2. Để nhập văn bản vào hộp văn bản mà không sử dụng phương thức sendKeys ()

js.executeScript("document.getElementById('email').setAttribute('value','');");
js.executeScript("document.getElementById('password').setAttribute('value','123456');");

"value" là thuộc tính trong thẻ input. Ngoài thuộc tính "value" thì có thể dùng các thuộc tính còn lại như "placeholder", "innerHTML",...value" là thuộc tính trong thẻ input. Ngoài thuộc tính "value" thì có thể dùng các thuộc tính còn lại như "placeholder", "innerHTML",...

3. Để xử lý Checkbox bằng cách chuyển giá trị là true hoặc false

js.executeScript("document.getElementById('id_of_element').checked=false;");
//hoặc
js.executeScript("document.getElementById('id_of_element').checked=true;");

4. Để tạo Alert trong Selenium Webdriver

js.executeScript("alert('Welcome To Anh Tester - Automation Testing');");

5. Để làm mới cửa sổ trình duyệt bằng Javascript

js.executeScript("history.go(0)");

6. Để lấy nội dung của toàn bộ trang web trong Selenium

String innerText = js.executeScript("return document.documentElement.innerText;").toString();
System.out.println(innerText);

7. Để lấy Tiêu đề của trang web

import org.openqa.selenium.JavascriptExecutor;​

8. Để lấy tên miền

import org.openqa.selenium.JavascriptExecutor;​

9. Để lấy URL của một trang web

import org.openqa.selenium.JavascriptExecutor;​

10. Để lấy Chiều cao và Chiều rộng của một trang web

import org.openqa.selenium.JavascriptExecutor;​

11. Để tìm một phần tử ẩn (bị khuất) trong Selenium bằng JavaScriptExecutor

import org.openqa.selenium.JavascriptExecutor;​

12. Để điều hướng đến một trang khác bằng Javascript

import org.openqa.selenium.JavascriptExecutor;​

13. Để thực hiện Cuộn chuột

a) Để cuộn trang theo chiều dọc 500px

import org.openqa.selenium.JavascriptExecutor;​

b) Để cuộn trang theo chiều dọc cho đến hết (cuối trang)

import org.openqa.selenium.JavascriptExecutor;​

c) Để cuộn tới 1 phần tử trong trang (này dùng nhiều)

import org.openqa.selenium.JavascriptExecutor;​

14. Thêm một phần tử trong DOM

Chúng ta cũng có thể thêm một phần tử trong DOM nếu được yêu cầu. Tuy nhiên, vì chỉ liên quan đến việc bắt chước các tương tác của người dùng trong trình duyệt, tùy chọn này có thể không được sử dụng.

import org.openqa.selenium.JavascriptExecutor;​

15. Set và Get giá trị vào LocalStorage trên Browser

LocalStorage là nơi trong Browser để chứa các biến (Key) kèm giá trị tương ứng tồn tại trong suốt quá trình mở Browser đó. Giống giống Properties á. Mình có thể tận dụng để Set và Get giá trị trong quá trình chạy auto có sự chuyển trang chuyển tab gì đó xong sẽ dùng lại giá trị ban đầu thì LocalStorage rất hiệu quả đây.

16. Highlight phần tử trên web

Đây là ví dụ highlight cái border của một element lên màu Đỏ

JavascriptExecutor js = (JavascriptExecutor) driver;

Set giá trị vào LocalStorage trên Browser:

JavascriptExecutor js = (JavascriptExecutor) driver;

Ví dụ:

js.executeScript​(java.lang.String script, java.lang.Object... args)

Get giá trị từ LocalStorage trên Browser:

JavascriptExecutor js = (JavascriptExecutor) driver;

Ví dụ: tiếp tục của ví dụ trên thì mình sẽ gọi key "age" ra để lấy giá trị 30:age" ra để lấy giá trị 30:

JavascriptExecutor js = (JavascriptExecutor) driver;

Vậy là xong !!!

Chú ý:

Chúng ta có các hàm document.getElementBy* sau:document.getElementBy* sau:

Các lệnh Javascript tham khảo thêm:

https://www.w3schools.com/jsref/default.asp

Code demoJavascriptExecutor JavascriptExecutor

JavascriptExecutor js = (JavascriptExecutor) driver;

Ví dụ sendKeys

JavascriptExecutor js = (JavascriptExecutor) driver;

Ví dụ Scroll and Click

JavascriptExecutor js = (JavascriptExecutor) driver;

Nếu mình dùng dòng lệnh

js.executeScript​(java.lang.String script, java.lang.Object... args)

Còn dùng Js để click thì nó dựa vào DOM để click nên không quan tâm bị che.

Ví dụ về Set và Get LocalStorage với Javascript

JavascriptExecutor js = (JavascriptExecutor) driver;

Cái SetupBrowser là class viết riêng chứa createDriver và closeDriver cái browser (driver).SetupBrowser là class viết riêng chứa createDriver và closeDriver cái browser (driver).

JavascriptExecutor js = (JavascriptExecutor) driver;