目錄1. Selenium WebDriver 是什么？2. 安裝？3. 編寫腳本 3.1. 創建瀏覽器會話(Chrome) 3.2. 頁面導航控制(加載指定測試頁面) 3.3. 查找 DOM 元素 3.4. 獲取元素屬性 3.5. 模擬鍵盤動作 3.6. 模擬鼠標動作 3.7. alert 窗口控制4.?效果展示1. Selenium WebDriver 是什么？

Selenium is an umbrella project(一攬子項目) for a range of tools and libraries that enable and support the automation of web browsers.

• It provides extensions to emulate user interaction with browsers, a distribution server for scaling browser allocation, and the infrastructure for implementations of the W3C WebDriver specification that lets you write interchangeable code for all major web browsers.

• At the core of Selenium is WebDriver, an interface to write instruction sets that can be run interchangeably in many browsers.

2. 安裝？

Selenium Installation 分兩步：

• 選擇一種測試腳本編程語言(Java、JavaScript、Ruby 等)。(這里選的是 JavaScript)

• 安裝與瀏覽器對應的 WebDriver 驅動包。(這里選的是 Chrome 版驅動)

  • 下載地址：https://chromedriver.storage.googleapis.com/index.html

  • 配置 WebDriver 驅動包的 PATH 變量

3.?編寫腳本

3.1. 創建瀏覽器會話(Chrome)

const {Builder} = require('selenium-webdriver');(async function myFunction() { let driver = await new Builder().forBrowser('chrome').build(); //your code inside this block})();

3.2. 頁面導航控制(加載指定測試頁面)

await?driver.get('https://selenium.dev');

注：通常頁面導航后，需要等到某個東西初始化完成，才能開始測試，所以需要用到 Selenium WebDriver 的 Waits 技能：?

await?driver.get('file:///race_condition.html');//?等待檢測到變量?initialised?為?true?時，再進行后續測試await driver.wait(() => driver.executeScript('return initialised'), 10000);const element = driver.findElement(By.css('p'));assert.strictEqual(await element.getText(), 'Hello from JavaScript!');

3.3. 查找 DOM 元素

// Find Elementlet?searchBar?=?driver.findElement(By.name('q'));//?Find Elementslet elements = await driver.findElements(By.css('p'));for(let?e?of?elements)?{ console.log(await?e.getText());}// Find Element From ElementWebElement searchForm = driver.findElement(By.tagName("form"));WebElement searchBox = searchForm.findElement(By.name("q"));//?Find?Elements?From?Elementlet?element?=?driver.findElement(By.css("div"));let elements = await element.findElements(By.css("p"));for(let?e?of?elements)?{ console.log(await?e.getText());}

3.4. 獲取元素屬性

let element = await driver.findElement(By.css("div"));const?fontWeight?=?await?element.getCssValue("font-weight");?//?CSS?樣式const?readonly?=?await?element.getAttribute("readonly");?//?只讀屬性

3.5. 模擬鍵盤動作

• sendKeys

  • The sendKeys types a key sequence in DOM element even if modifier key sequence is encountered. Here are the list of possible keystrokes that WebDriver Supports.

const?searchBtn?=?await?driver.findElement(By.name('q'))await searchBtn.sendKeys('webdriver',?Key.ENTER);

• clear

  • Clears the content of an editable element. This is only applied for the elements which is editable and interactable, otherwise Selenium returns the error (invalid element state (or) Element not interactable)

3.6. 模擬鼠標動作

• clickAndHold

let searchBtn = driver.findElement(By.linkText("Sign in"));const actions = driver.actions({async: true});// Perform mouseMove to element and mouseDown (press) action on the elementawait actions.move({origin:searchBtn}).press().perform();

• contextClick

let?searchBtn?=?driver.findElement(By.linkText("Sign?in"));const?actions?=?driver.actions({async:?true});//?Perform?context-click?action?on?the?elementawait?actions.contextClick(searchBtn).perform();

• doubleClick

let searchBtn = driver.findElement(By.linkText("Sign in"));const actions = driver.actions({async: true});// Perform double-click action on the elementawait actions.doubleClick(searchBtn).perform();

• moveToElement

let?gmailLink?=?driver.findElement(By.linkText("Gmail"));const actions = driver.actions({async: true});// Performs mouse move action onto the elementawait?actions.move({origin:gmailLink}).perform();

• release

// Store 'box A' as source elementlet sourceEle = driver.findElement(By.id("draggable"));// Store 'box B' as source elementlet targetEle = driver.findElement(By.id("droppable"));const actions = driver.actions({async: true});await actions.move({origin:sourceEle}).press().perform();// Performs release event on target elementawait actions.move({origin:targetEle}).release().perform();

3.7.?alert?窗口控制

//Click the link to activate the alertawait driver.findElement(By.linkText('See an example alert')).click();// Wait for the alert to be displayedawait driver.wait(until.alertIsPresent());// Store the alert in a variablelet alert = await driver.switchTo().alert();//Store the alert text in a variablelet alertText = await alert.getText();//Press the OK buttonawait?alert.accept();

?

4. 效果展示

參考：

Selenium WebDriver 下載頁：

https://www.selenium.dev/documentation/en/webdriver/driver_requirements/

Chrome 版 WebDriver 下載地址：

https://chromedriver.storage.googleapis.com/index.html

Selenium WebDriver -> Waits：

https://www.selenium.dev/documentation/en/webdriver/waits/

---

總結

以上是生活随笔為你收集整理的自动化测试 div sendkeys无效_【自动化测试】【JestSelenium】（04）—— Selenium WebDriver...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。