測試過程中經常遇到下來菜單，比如說分頁，每頁顯示的條數，以及語言的切換，很多時候經常是以下來菜單的形式展現，下面我們看一下selenium如何處理下來菜單。
首先selenium 很人性化的給提供了一個Select的模塊，供處理下來菜單，首先我們需要導入Select，通過from selenium.webdriver.support.select import Select來導入。
Select中提供幾個用於定位的option的方法,下面看一下具體的方法
主要把Select方法總結了一下分為三大類：
1.選擇列表
- select_by_index(self, index) #以index屬性值來查找匹配的元素並選擇；
- select_by_value(self, value) #以value屬性值來查找該option並選擇；
- select_by_visible_text(self, text) #以text文本值來查找匹配的元素並選擇；
- first_selected_option(self) #選擇第一個option 選項 ；
為了測試以上的方法，從網上找的了一個簡單的頁面，來輔助測試
<html> <body> <form> <select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat" selected="selected">Fiat</option> <option value="audi">Audi</option> </select> </form> </body> </html>
針對按索引進行切換option屬性示例如下。常用方法
#-*- coding:utf-8 -*- import time from selenium import webdriver from selenium.webdriver.support.select import Select driver = webdriver.Chrome() driver.maximize_window() driver.get('file:///C:/Users/hunk/Desktop/select.html') time.sleep(2) #默認option顯示"Fiat" S = Select(driver.find_element_by_name('cars')).select_by_index(0) #實例化Select,按索引選擇option。索引以0開始 time.sleep(2) #切換后option顯示"Volvo" driver.quit()
針對按value進行切換option屬性示例如下。常用方法
#-*- coding:utf-8 -*- import time from selenium import webdriver from selenium.webdriver.support.select import Select driver = webdriver.Chrome() driver.maximize_window() driver.get('file:///C:/Users/hunk/Desktop/select.html') time.sleep(2) #默認option顯示"Fiat" S = Select(driver.find_element_by_name('cars')).select_by_value('saab') #實例化Select,按value選擇option。這里的value是標簽的屬性value，<option value="saab">Saab</option> time.sleep(2) #切換后option顯示"saab" driver.quit()
針對按text文本進行切換option屬性示例如下。常用方法
#-*- coding:utf-8 -*- import time from selenium import webdriver from selenium.webdriver.support.select import Select driver = webdriver.Chrome() driver.maximize_window() driver.get('file:///C:/Users/hunk/Desktop/select.html') time.sleep(2) #默認option顯示"Fiat" S = Select(driver.find_element_by_name('cars')).select_by_visible_text ('Audi') #實例化Select,text值是選擇的我們下拉菜單時看到的值 time.sleep(2) #切換后option顯示"Audi" driver.quit()
使用first_selected_option(self) 來切換到第一個option，該方法與select_by_index(0)實現的效果相同，直接看一下代碼執行效果，詳細的就解釋了
#-*- coding:utf-8 -*- import time from selenium import webdriver from selenium.webdriver.support.select import Select driver = webdriver.Chrome() driver.maximize_window() driver.get('file:///C:/Users/hunk/Desktop/select.html') time.sleep(2) #默認option顯示"Fiat" S = Select(driver.find_element_by_name('cars')).first_selected_option time.sleep(2) #切換后option顯示"Audi" driver.quit()
2.清除選擇列表
第一類我們講解了如何選擇列表，總共介紹了4種方法，但是既然可以選擇我們就可以清除選擇，而前三種取消方法可以與選擇一一對應，下面我們看下如何清除選擇
- deselect_by_index(self, index) #以index屬性值來查找匹配的元素並取消選擇；
- deselect_by_value(self, value) #以value屬性值來查找該option並取消選擇；
- deselect_by_visible_text(self, text) #以text文本值來查找匹配的元素並取消選擇；
- deselect_all(self) #將所有選擇清除；
因為按照上面的頁面示例，我們切換完成以后是沒有辦法清除，下面我們來普及一下html <select> 標簽的multiple 屬性，multiple 屬性規定可同時選擇多個選項，可以把 multiple 屬性與 size 屬性配合使用，來定義可見選項的數目，所以我們會涉及到取消模式。
下面是不包含multiple 和 包含 multiple 的兩種樣式
<select> 標簽樣式
<select> 標簽的multiple 屬性樣式
由於選擇已經介紹的很詳細，那么我們配合的選擇和取消，寫一個例子共同演示一下
輔助測試的頁面html代碼
<html> <body> <select name="cars" multiple="multiple" size="4"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="mercedes">Mercedes</option> <option value="audi">Audi</option> </select> </body> </html>
首先我們通過index、value、text文本三種方式進行選擇，然后再次按index、value、text 進行取消，最后遍歷所有的option循環選擇，最后全部取消。
#-*- coding:utf-8 -*- import time from selenium import webdriver from selenium.webdriver.support.select import Select driver = webdriver.Chrome() driver.maximize_window() driver.get('file:///C:/Users/hunk/Desktop/select.html') '''本示例中所有設置等待時間均為便於觀察效果''' time.sleep(1) Select(driver.find_element_by_name('cars')).select_by_index(0) #以索引選擇 time.sleep(1) Select(driver.find_element_by_name('cars')).select_by_value('saab') #以value屬性值選擇 time.sleep(1) Select(driver.find_element_by_name('cars')).select_by_visible_text('Mercedes') #以text 文本進行選擇 time.sleep(2) Select(driver.find_element_by_name('cars')).deselect_by_index(0) time.sleep(1) Select(driver.find_element_by_name('cars')).deselect_by_value('saab') #以value屬性值取消選擇 time.sleep(1) Select(driver.find_element_by_name('cars')).deselect_by_visible_text('Mercedes') #以text 文本進行取消選擇 time.sleep(1) '''獲取所有的option的text值,進行遍歷通過text文本進行選擇''' Options = Select(driver.find_element_by_name('cars')).options #該方法下面會詳細介紹，此處為了獲取所有的options選項 for option in Options: Select(driver.find_element_by_name('cars')).select_by_visible_text(option.text) #循環選擇 time.sleep(1) Select(driver.find_element_by_name('cars')).deselect_all() time.sleep(1) driver.quit()
代碼邏輯不重要，重要的是看效果，如下顯示
3.選項
雖然選項沒有上面兩大塊那么重要，但是我們還需要簡單的來看一下
- options #以列表形式返回屬於此select標簽的所有option
- all_selected_options #全部選擇了的option的列表
- first_selected_option #第一個被選中的option元素如果select沒有multiple值，此時獲取值為當前選擇的option
option 方法上面的例子已經使用過了，下面我們來介紹一下
def options(self): '''以列表形式返回屬於此select標簽的所有option''' return self._el.find_elements(By.TAG_NAME, 'option')
示例：
#-*- coding:utf-8 -*- from selenium import webdriver from selenium.webdriver.support.select import Select driver = webdriver.Chrome() driver.maximize_window() driver.get('file:///C:/Users/hunk/Desktop/select.html') S = Select(driver.find_element_by_name('cars')).options #實例化Select,並且獲取所有的options for option in S: #遍歷options print(option.text) #獲取option值 driver.quit()
我們結合着上面的例子把剩下的兩種option方法一起演示下，下面在上面的例子進行改造一下，來看看會出現上面樣子的效果
#-*- coding:utf-8 -*- import time from selenium import webdriver from selenium.webdriver.support.select import Select driver = webdriver.Chrome() driver.maximize_window() driver.get('file:///C:/Users/hunk/Desktop/select.html') '''本示例中所有設置等待時間均為便於觀察效果''' time.sleep(1) Select(driver.find_element_by_name('cars')).select_by_index(0) #以索引選擇 time.sleep(1) Select(driver.find_element_by_name('cars')).select_by_value('saab') #以value屬性值選擇 time.sleep(1) Select(driver.find_element_by_name('cars')).select_by_visible_text('Mercedes') #以text 文本進行選擇 time.sleep(2) options = Select(driver.find_element_by_name('cars')).all_selected_options #獲取所有選擇的option '''這里我們遍歷下看看那些值被選中''' for option in options: print('已經被選中option文本值:' + option.text) Select(driver.find_element_by_name('cars')).deselect_by_index(0) time.sleep(1) Select(driver.find_element_by_name('cars')).deselect_by_value('saab') #以value屬性值取消選擇 time.sleep(1) Select(driver.find_element_by_name('cars')).deselect_by_visible_text('Mercedes') #以text 文本進行取消選擇 time.sleep(1) '''獲取所有的option的text值,進行遍歷通過text文本進行選擇''' Options = Select(driver.find_element_by_name('cars')).options #該方法下面會詳細介紹，此處為了獲取所有的options選項 for option in Options: Select(driver.find_element_by_name('cars')).select_by_visible_text(option.text) #循環選擇 time.sleep(1) '''因為遍歷的過程中Volvo的索引為0,Volvo則被第一個選中''' selectOption = Select(driver.find_element_by_name('cars')).first_selected_option print (selectOption.text) Select(driver.find_element_by_name('cars')).deselect_all() time.sleep(1) driver.quit()
我們把option添加以后，控制台打印了一下效果，看看是否是獲取了對應的值
上述把Select模塊中常用的方法介紹了，通過兩種不同的下拉菜單，對所有的方法進行了介紹，我采用紅色標記的方法是我們實際項目中經常會使用的，需要更加深刻的去理解。