Selenium實戰（三）——滑動解鎖+窗口截圖

一、簡單滑塊的實例

當單機滑塊時，改變的只是CSS樣式，HTML代碼如下：

<div class="slide-to-unlock-progress" style="background-color: rgb(255, 233, 127); height: 36px;"></div>
<div class="slide-to-unlock-handle" style="background-color: rgb(255, 255, 255); height: 38px; line-height: 38px; width: 37px;"></div>

　　slide-to-unlock-handle表示滑塊。在滑動過程中，滑塊的左邊距逐漸變大；slide-to-unlock-progress表示滑過之后的背景色，背景色的區域會逐漸增加。

from selenium import webdriver
from time import sleep

from selenium.common.exceptions import UnexpectedAlertPresentException
from selenium.webdriver import ActionChains

driver = webdriver.Chrome()
driver.maximize_window()

driver.get("https://www.helloweba.net/demo/2017/unlock/")

# 定位滑塊
slider = driver.find_elements_by_class_name("slide-to-unlock-handle")[2]
action = ActionChains(driver)
action.click_and_hold(slider).perform()

for index in range(200):
    try:
        action.move_by_offset(5, 0).perform()
    except UnexpectedAlertPresentException:
        break
    action.reset_actions()
    sleep(0.1)      # 等待停頓時間

# 打印警告框提示
success_text = driver.switch_to.alert.text

 方法解讀：

• click_and_hold():單擊並按下鼠標左鍵；
• move_by_offset():移動鼠標，第一個參數為x坐標距離，第二個參數為y坐標距離；
• reset_action():重置action.

 

# 獲取滑塊元素
sour = driver.find_element_by_id("***")

# 獲取滑塊的滾動區域元素
ele = driver.find_element_by_name("***")

# 拖動滑塊
ActionChains(driver).drag_and_drop_by_offset(sour,ele.size['width'],-sour.size['height']).perform()

二、上下滑動選擇日期

 

from selenium import webdriver
from time import sleep

driver = webdriver.Firefox()
driver.maximize_window()
driver.get("http://www.jq22.com/yanshi4976")
sleep(2)
driver.switch_to.frame("iframe")
driver.find_element_by_id("appDate").click()

# 定位要滑動的年、月、日
dwwos = driver.find_elements_by_class_name("dwwo")
year = dwwos[0]
month = dwwos[1]
day = dwwos[2]

action = webdriver.TouchActions(driver)
action.scroll_from_element(year, 0, 5).perform()
action.scroll_from_element(month, 0, 30).perform()
action.scroll_from_element(day, 0, 30).perform()

這里使用TouchActions類中的scroll_from_element()方法滑動元素。參數如下：

•  on_element:滑動的元素
• xoffset:x坐標距離
• yoffset:y坐標距離

有遺留的問題沒解決：

找了試了各種方法（更新瀏覽器，重新選擇chromedriver都無果，枯了），終於終於可算是有了解決辦法了，參考網址：https://stackoverflow.com/questions/56111529/cannot-call-non-w3c-standard-command-while-in-w3c-mode-seleniumwebdrivererr，加了一段代碼，如下：

from selenium import webdriver
from time import sleep
opt = webdriver.ChromeOptions()
opt.add_experimental_option('w3c', False)
driver = webdriver.Chrome(chrome_options=opt)
driver.maximize_window()
driver.get("http://www.jq22.com/yanshi4976")
sleep(2)
driver.switch_to.frame("iframe")
driver.find_element_by_id("appDate").click()

# 定位要滑動的年、月、日
dwwos = driver.find_elements_by_class_name("dwwo")
year = dwwos[0]
month = dwwos[1]
day = dwwos[2]

action = webdriver.TouchActions(driver)
action.scroll_from_element(year, 0, 5).perform()
action.scroll_from_element(month, 0, 30).perform()
action.scroll_from_element(day, 0, 30).perform()

driver.find_element_by_xpath("/html/body/div[3]/div/div[2]/div[2]/div[3]/span[1]").click()

簡單理解了一下，大致是不符合w3c的標准，加一行禁用的代碼就可以了~愚人笨解哈哈哈哈哈，來放個結果圖：

三、窗口截圖

　　WebDriver提供了截圖函數save_screenshut(),可用來截取當前窗口。WebDriver建議使用png作為圖片的后綴名。腳本運行完成后，會在當前files/目錄中生成baidu_img.png圖片。

from selenium import webdriver
driver = webdriver.Chrome()
driver.get("http://www.baidu.com")

# 截取當前窗口，指定截圖圖片的保存位置
driver.save_screenshot("./files/baidu_img.png")

2.截取部分圖片

　　這里要安裝一個pillow庫：pip install pillow

def get_pictures(self):
    self.driver.get('http://10.98.0.224:5201/V4/index.html#/login')  # 打開登陸頁面
    self.driver.save_screenshot('pictures.png')  # 全屏截圖
    page_snap_obj = Image.open('pictures.png')
    img = self.driver.find_element_by_xpath("/html/body/div/div/div/div[3]/div/div[1]/ul/li[4]/img")  # 驗證碼元素位置
    time.sleep(1)
    location = img.location
    size = img.size  # 獲取驗證碼的大小參數
    left = location['x']
    top = location['y']
    right = left + size['width']
    bottom = top + size['height']
    image_obj = page_snap_obj.crop((left, top, right, bottom))  # 按照驗證碼的長寬，切割驗證碼
    # image_obj.show()  # 打開切割后的完整驗證碼
    self.driver.close()  # 處理完驗證碼后關閉瀏覽器
    return image_obj