python + selenium + chrome 在實現back，forward，refresh時的注意事項

python + selenium + chrome 在實現back，forward，refresh時的注意事項

1. 背景

在使用selenium模擬瀏覽器時，經常會使用到導航欄的三個按鈕：後退，前進，刷新。來達到在瀏覽過的頁面之間進行切換。對應到selenium中的方法分別是：back()，forward()， refresh() 。但是如果直接使用之前定位到的元素，會出現一個問題，那就是：元素失焦。

2. 環境

• python 3.6.1
• 系統：win7
• IDE：pycharm
• 安裝過chrome瀏覽器
• 配置好chromedriver
• selenium 3.7.0

3. 代碼解析

from selenium import webdriver
from selenium.webdriver.common.by import By
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.action_chains import ActionChains
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.ui import Select

import time
import random

# 加載xpath插件
chrome_options = webdriver.ChromeOptions()
extension_path = 'D:/extension/XPath-Helper_v2.0.2.crx'
chrome_options.add_extension(extension_path)

browser = webdriver.Chrome(chrome_options=chrome_options)
# browser.maximize_window()
wait = WebDriverWait(browser, 25)
waitPopWindow = WebDriverWait(browser, 25)


firstUrl = "https://www.taobao.com/"
browser.get(firstUrl)
time.sleep(random.randrange(3, 5, 1))

# 第一次獲取 淘寶 輸入框
searchInput = browser.find_element_by_xpath("//input[@id='q' and @class='search-combobox-input']")
print(f"searchInputBefore = {searchInput}")
searchInput.click()
searchInput.send_keys("abcTest")

time.sleep(random.randrange(3, 5, 1))

# 第一種測試：back()
# 進入amazon網站
secondUrl = "https://www.amazon.com/"
browser.get(secondUrl)
time.sleep(random.randrange(3, 5, 1))
# 返回淘寶主頁
browser.back()

# 第二種測試：refresh()
# browser.refresh()

time.sleep(random.randrange(3, 5, 1))

# 第二次獲取 淘寶 輸入框
searchInput = browser.find_element_by_xpath("//input[@id='q' and @class='search-combobox-input']")
print(f"searchInputAfter = {searchInput}")
searchInput.send_keys("abcTest")

time.sleep(random.randrange(3, 5, 1))

# 再次前進到 amazon主頁
browser.forward()

print(f"演示結束")
time.sleep(random.randrange(3, 5, 1))
browser.quit()

• 結果顯示，對前後的兩個淘寶頁面來說，輸入框的ID是不同的，舊的元素無法繼續使用。
• 同樣的，當頁面進行refresh之後，元素的ID也會發生變化。

searchInputBefore = <selenium.webdriver.remote.webelement.WebElement (session="1adae9c334324c3e9137796ea16fdc12", element="0.7525547144214484-1")>
searchInputAfter = <selenium.webdriver.remote.webelement.WebElement (session="1adae9c334324c3e9137796ea16fdc12", element="0.746747334537434-1")>
演示結束

• 如果把 line：49行 註釋掉，就會出現如下的情況：

Traceback (most recent call last):
  File "E:/PyCharmCode/amazonSearchClick/test.py", line 48, in <module>
    searchInput.send_keys("abcTest")
  File "E:\Miniconda\lib\site-packages\selenium\webdriver\remote\webelement.py", line 352, in send_keys
    'value': keys_to_typing(value)})
  File "E:\Miniconda\lib\site-packages\selenium\webdriver\remote\webelement.py", line 501, in _execute
    return self._parent.execute(command, params)
  File "E:\Miniconda\lib\site-packages\selenium\webdriver\remote\webdriver.py", line 308, in execute
    self.error_handler.check_response(response)
  File "E:\Miniconda\lib\site-packages\selenium\webdriver\remote\errorhandler.py", line 194, in check_response
    raise exception_class(message, screen, stacktrace)
selenium.common.exceptions.StaleElementReferenceException: Message: stale element reference: element is not attached to the page document
  (Session info: chrome=63.0.3239.132)
  (Driver info: chromedriver=2.34.522940 (1a76f96f66e3ca7b8e57d503b4dd3bccfba87af1),platform=Windows NT 6.1.7601 SP1 x86_64)

• 也就是說，只要頁面發生過變動，重新加載了元素，那麼元素的ID就會發生變化，需要重新獲取。