實戰演練

之前我們對web元素做的操作主要是:選擇元素,然後 點擊元素 或者 輸入 字符串。

還有沒有其他的操作了呢?

有。

比如:比如 鼠標右鍵點擊、雙擊、移動鼠標到某個元素、鼠標拖拽等。

這些操作,可以通過 Selenium 提供的 ActionChains 類來實現。

ActionChains 類 裏面提供了 一些特殊的動作的模擬,我們可以通過 ActionChains 類的代碼查看到,如下所示

image

 

我們以移動鼠標到某個元素爲例。

百度首頁的右上角,有個 更多產品 選項,如下圖所示

白月黑羽Python3教程

如果我們把鼠標放在上邊,就會彈出 下面的 糯米、音樂、圖片 等圖標。

使用 ActionChains 來 模擬鼠標移動 操作的代碼如下:

from selenium import webdriver

driver = webdriver.Chrome(r'f:\chromedriver.exe')
driver.implicitly_wait(5)

driver.get('https://www.baidu.com/')

from selenium.webdriver.common.action_chains import ActionChains

ac = ActionChains(driver)

# 鼠標移動到 元素上
ac.move_to_element(
    driver.find_element_by_css_selector('[name="tj_briicon"]')
).perform()

凍結界面

有些網站上面的元素, 我們鼠標放在上面,會動態彈出一些內容。

比如,百度首頁的右上角,有個 更多產品 選項,如下圖所示

白月黑羽Python3教程

如果我們把鼠標放在上邊,就會彈出 下面的 糯米、音樂、圖片 等圖標。

如果我們要用 selenium 自動化 點擊 糯米圖標,就需要 F12 查看這個元素的特徵。

但是 當我們的鼠標 從 糯米圖標 移開, 這個 欄目就整個消失了, 就沒法 查看 其對應的 HTML。

怎麼辦?

可以如下圖所示:

白月黑羽Python3教程

 

在 開發者工具欄 console 裏面執行如下js代碼

setTimeout(function(){debugger}, 5000)

 

這句代碼什麼意思呢?

表示在 5000毫秒後,執行 debugger 命令

執行該命令會 瀏覽器會進入debug狀態。 debug狀態有個特性, 界面被凍住, 不管我們怎麼點擊界面都不會觸發事件。

 

所以,我們可以在輸入上面代碼並回車 執行後, 立即 鼠標放在界面 右上角 更多產品處。

這時候,就會彈出 下面的 糯米、音樂、圖片 等圖標。

然後,我們仔細等待 5秒 到了以後, 界面就會因爲執行了 debugger 命令而被凍住。

然後,我們就可以點擊 開發者工具欄的 查看箭頭, 再去 點擊 糯米圖標 ,查看其屬性了。

彈出對話框

有的時候,我們經常會在操作界面的時候,出現一些彈出的對話框。

請大家打開這個網址 http://f.python3.vip/webauto/test4.html

分別點擊界面的3個按鈕,你可以發現:

彈出的對話框有三種類型,分別是 Alert(警告信息)、confirm(確認信息)和prompt(提示輸入)

Alert

Alert 彈出框,目的就是顯示通知信息,只需用戶看完信息後,點擊 OK(確定) 就可以了。

那麼,自動化的時候,代碼怎麼模擬用戶點擊 OK 按鈕呢?

selenium提供如下方法進行操作

driver.switch_to.alert.accept()

注意:如果我們不去點擊它,頁面的其它元素是不能操作的。

 

如果程序要獲取彈出對話框中的信息內容, 可以通過 如下代碼

driver.switch_to.alert.text

 

示例代碼如下

from selenium import webdriver
driver = webdriver.Chrome()
driver.implicitly_wait(5)
driver.get('http://f.python3.vip/webauto/test4.html')


# --- alert ---
driver.find_element_by_id('b1').click()

# 打印 彈出框 提示信息
print(driver.switch_to.alert.text) 

# 點擊 OK 按鈕
driver.switch_to.alert.accept()

Confirm

Confirm彈出框,主要是讓用戶確認是否要進行某個操作。

比如:當管理員在網站上選擇刪除某個賬號時,就可能會彈出 Confirm彈出框, 要求確認是否確定要刪除。

Confirm彈出框 有兩個選擇供用戶選擇,分別是 OK 和 Cancel, 分別代表 確定 和 取消 操作。

那麼,自動化的時候,代碼怎麼模擬用戶點擊 OK 或者 Cancel 按鈕呢?

selenium提供如下方法進行操作

如果我們想點擊 OK 按鈕, 還是用剛纔的 accept方法,如下

driver.switch_to.alert.accept()

如果我們想點擊 Cancel 按鈕, 可以用 dismiss方法,如下

driver.switch_to.alert.dismiss()

 

示例代碼如下

from selenium import webdriver
driver = webdriver.Chrome()
driver.implicitly_wait(5)
driver.get('http://f.python3.vip/webauto/test4.html')

# --- confirm ---
driver.find_element_by_id('b2').click()

# 打印 彈出框 提示信息
print(driver.switch_to.alert.text)

# 點擊 OK 按鈕 
driver.switch_to.alert.accept()

driver.find_element_by_id('b2').click()

# 點擊 取消 按鈕
driver.switch_to.alert.dismiss()

Prompt

出現 Prompt 彈出框 是需要用戶輸入一些信息,提交上去。

比如:當管理員在網站上選擇給某個賬號延期時,就可能會彈出 Prompt 彈出框, 要求輸入延期多長時間。

可以調用如下方法

driver.switch_to.alert.send_keys()

 

示例代碼如下

from selenium import webdriver
driver = webdriver.Chrome()
driver.implicitly_wait(5)
driver.get('http://f.python3.vip/webauto/test4.html')


# --- prompt ---
driver.find_element_by_id('b3').click()

# 獲取 alert 對象
alert = driver.switch_to.alert

# 打印 彈出框 提示信息
print(alert.text)

# 輸入信息,並且點擊 OK 按鈕 提交
alert.send_keys('web自動化 - selenium')
alert.accept()

# 點擊 Cancel 按鈕 取消
driver.find_element_by_id('b3').click()
alert = driver.switch_to.alert
alert.dismiss()

注意 : 有些彈窗並非瀏覽器的alert 窗口,而是html元素,這種對話框,只需要通過之前介紹的選擇器選中並進行相應的操作就可以了。

其他技巧

下面是一些其他的 Selenium 自動化技巧

窗口大小

有時間我們需要獲取窗口的屬性和相應的信息,並對窗口進行控制

  • 獲取窗口大小
driver.get_window_size()
  • 改變窗口大小
driver.set_window_size(x, y)

獲取當前窗口標題

瀏覽網頁的時候,我們的窗口標題是不斷變化的,可以使用WebDriver的title屬性來獲取當前窗口的標題欄字符串。

driver.title

獲取當前窗口URL地址

driver.current_url

例如,訪問白月黑羽Python在線教程網站,並獲取當前窗口的標題

from selenium import  webdriver

driver = webdriver.Chrome()
driver.implicitly_wait(5)

# 打開網站
driver.get('https://www.python3.vip/')

# 獲取網站標題欄文本
print(driver.title) 

# 獲取網站地址欄文本
print(driver.current_url) 

截屏

有的時候,我們需要把瀏覽器屏幕內容保存爲圖片文件。

比如,做自動化測試時,一個測試用例檢查點發現錯誤,我們可以截屏爲文件,以便測試結束時進行人工覈查。

可以使用 WebDriver 的 get_screenshot_as_file方法來截屏並保存爲圖片。

from selenium import  webdriver

driver = webdriver.Chrome()
driver.implicitly_wait(5)

# 打開網站
driver.get('https://www.baidu.com/')

# 截屏保存爲圖片文件
driver.get_screenshot_as_file('1.png')

手機模式

我們可以通過 desired_capabilities 參數,指定以手機模式打開chrome瀏覽器

參考代碼,如下

from selenium import webdriver

mobile_emulation = { "deviceName": "Nexus 5" }

chrome_options = webdriver.ChromeOptions()

chrome_options.add_experimental_option("mobileEmulation", mobile_emulation)

driver = webdriver.Chrome( desired_capabilities = chrome_options.to_capabilities())

driver.get('http://www.baidu.com')

input()
driver.quit()
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章