Selenium 是一系列基於 Web 的自動化工具，提供一套測試函式，用於支援 Web 自動化測試。函式非常靈活，能夠完成介面元素定位、視窗跳轉、結果比較。具有如下特點：

1. **支援多瀏覽器。**如 IE、Firefox、Safari、Chrome、Android 手機瀏覽器等。
2. **支援多種語言。**如 Java、C#、Python、Ruby、PHP等。
3. **支援多種作業系統。**如Windows、Linux、IOS、Android等。
4. **開源免費。**官網：[http://www.seleniumhg.org/](http://www.seleniumhg.org/ "http://www.seleniumhg.org/")。

## 一、Selenium 組成部分
### 1.1 Selenium IDE
該工具是一個用於構建指令碼的初級工具，其實是 FireFox 的一個外掛，擁有一個易於使用的介面。

它擁有記錄功能，能夠記錄使用者執行的操作，並可以匯出為可重複使用的指令碼。如果沒有程式設計經驗，可以透過 Selenium IDE 來快速熟悉 Selenium 的命令。

### 1.2 Selenium RC
Selenium RC 是 Selenium 家族核心部分。

Selenium RC 支援多種不同的語言編寫自動化測試指令碼，透過 Selenium RC 的伺服器作為代理伺服器去訪問應用，從而達到測試的目的。

### 1.3 Selenium WebDriver

當 Selenium2.x 提出了 WebDriver 的概念之後，它提供了完全另外的一種方式與瀏覽器互動。那就是利用瀏覽器原生的 API，封裝成一套更加物件導向的 SeleniumWebDriver API，直接操作瀏覽器頁面裡的元素，甚至操作瀏覽器本身（截圖，視窗大小，啟動，關閉，安裝外掛，配置證照之類的）。

由於使用的是瀏覽器原生的 API，速度大大提高，而且呼叫的穩定性給了瀏覽器廠商本身，顯然是更加科學。然而帶來的一些副作用就是，不同的瀏覽器廠商，對 Web 元素的操作和呈現多少會有一些差異，這就直接導致了 Selenium WebDriver 要分瀏覽器廠商不同，而提供不同的實現。

例如 Firefox 就有專門的 FirefoxDriver，Chrome 就有專門的 ChromeDriver 等等（甚至包括了 AndroidDriver 和 iOS WebDriver）。

### 1.4 Selenium Grid
Selenium Grid 透過在許多伺服器上同時執行測試，將 Selenium Remote Control 帶到另一個層次，從而減少了測試多個瀏覽器或作業系統所需的時間。

這裡藉助 Selenium WebDriver，以[滴滴雲](https://blog.didiyun.com)控制檯的**預設選中**為例展示 Selenium 如何解放測試人員的雙手。

滴滴雲控制檯的 DC2 建立頁承載著複雜的業務邏輯，眾多頁面都需要跳轉到此，並需要根據 URL 上的引數而對 DC2 的配置做預設選中。

當多人開發對業務邏輯耦合時，眾多邏輯均會對預設選中的結果造成影響，難以避免導致 BUG 的產生。在手動測試的情況下，需要回歸測試整個頁面的所有功能點，而用 Selenium 如何保證頁面的穩定呢？

## 二、Selenium 安裝

Selenium 支援多種語言，Python 最受歡迎，安裝也比較簡單：
```
pip install selenium
```

然後需要根據[連結](https://sites.google.com/a/chromium.org/chromedriver/downloads)下載 ChromeDriver 到 /usr/local/bin。

執行以下程式碼檢測你的環境已經安裝完畢：
```
# coding = utf-8
from selenium import webdriver
import time

browser = webdriver.Chrome()
browser.get("http://www.baidu.com")
browser.find_element_by_id("kw").send_keys("selenium")
browser.find_element_by_id("su").click()
time.sleep(3)
browser.quit()
```
如果程式能正常開啟你的 Chrome 瀏覽器，輸入 Selenium 並搜尋，則說明 Selenium 安裝成功。

## 三、Selenium 定位頁面元素

WebDriver 提供了一系列的物件定位方法，常用的有 id, name, class name, link text, partial link text, tag name, xpath, css selector，針對百度的網頁可以有一下多種方法定位頁面元素。

```
#coding=utf-8

from selenium import webdriver
import time

browser = webdriver.Chrome()

browser.get("http://www.baidu.com")
time.sleep(2)

#########百度輸入框的定位方式##########

#透過id方式定位
browser.find_element_by_id("kw").send_keys("selenium")

#透過name方式定位
browser.find_element_by_name("wd").send_keys("selenium")

#透過tag name方式定位
browser.find_element_by_tag_name("input").send_keys("selenium")

#透過class name 方式定位
browser.find_element_by_class_name("s_ipt").send_keys("selenium")

#透過CSS方式定位
browser.find_element_by_css_selector("#kw").send_keys("selenium")

#透過xpath方式定位
browser.find_element_by_xpath("//input[@id='kw']").send_keys("selenium")

############################################

browser.find_element_by_id("su").click()
time.sleep(3)
browser.quit()
```
## 四、測試登入
因為[滴滴雲](https://blog.didiyun.com)控制檯部分頁面需登入後方可開啟，所以測試的第一步開啟首頁，填入使用者名稱密碼。

```
#coding=utf-8
from selenium import webdriver

import time

driver = webdriver.Chrome()
driver.get("http://app.didiyun.com")

driver.find_element_by_css_selector('input[type="text"]').send_keys("189****3932")
driver.find_element_by_css_selector('input[type="password"]').send_keys("3e****FV")
time.sleep(2)

subbutton=driver.find_element_by_css_selector('button[type="submit"]')

subbutton.click()

time.sleep(3)

```
檢查程式可以開啟滴滴雲控制檯首頁，併成功登入 DashBoard 頁，則登入驗證成功。

## 五、測試預設項選中

本次自動化測試的目的為檢測從官網跳轉到控制檯時，進入 [https://app.didiyun.com/#/dc2/add?srvType=ebs&systemDiskType=HE&zoneId=gz01 ](https://app.didiyun.com/#/dc2/add?srvType=ebs&systemDiskType=HE&zoneId=gz01  "https://app.didiyun.com/#/dc2/add?srvType=ebs&systemDiskType=HE&zoneId=gz01 ")頁，檢視能否預設選中廣州一區，標準雲伺服器，系統盤為高效雲盤。

```
#coding=utf-8
from selenium import webdriver

import time

driver = webdriver.Chrome()
driver.get("http://app.didiyun.com")

driver.find_element_by_css_selector('input[type="text"]').send_keys("18903393932")
driver.find_element_by_css_selector('input[type="password"]').send_keys("3edc$RFV%TGB")
time.sleep(2)

#測試的最終結果
TEST_PASS = True

subbutton=driver.find_element_by_css_selector('button[type="submit"]')

subbutton.click()

time.sleep(3)
if (driver.current_url == 'https://app.didiyun.com/#/'):
	print 'Success our dashboard login'

print "Opening our target page"
driver.get('https://app.didiyun.com/#/dc2/add?srvType=ebs&systemDiskType=HE&zoneId=gz01')

#瀏覽器開啟需要時間
time.sleep(3)
if (driver.current_url == 'https://app.didiyun.com/#/dc2/add?srvType=ebs&systemDiskType=HE&zoneId=gz01'):
	print 'Opened the dc2 add page'
#################################################
regionName = driver.find_element_by_css_selector('div.region-select3-item.active .region-head span').text

zoneName = driver.find_element_by_css_selector('div.region-select3-item.active .zone-item.active span').text
if(regionName != u'廣州'):
	TEST_PASS = False
	print u"期望區域是廣州，但實際選中是%s" %(regionName)
else:
	if(zoneName != '1'):
		TEST_PASS = False
		print u"期望1區，但實際選中是%s區" %(zoneName)
#################################################
serverType = driver.find_elements_by_xpath('//*[@id="app"]/div[2]/div/form/div[3]/div[1]/div/div[1]/div/div[2]/div/span[1]')[0].text

if(serverType != u'標準雲伺服器'):
	 TEST_PASS = False
	 print u"期望伺服器型別是標準雲伺服器，但實際選中是%s" %(serverType)
##################################################
serverVerion = driver.find_elements_by_xpath('//*[@id="app"]/div[2]/div/form/div[3]/div[2]/div[1]/div/label[1]/span/span')[0].text

if(serverVerion != u'通用型'):
	TEST_PASS = False
	print u"期望伺服器型別是通用型，但實際選中是%s" %(serverVerion)
#################################################
diskType = driver.find_element_by_css_selector('div.selector-wrapper input').get_attribute('value')
if(diskType != u'高效雲盤'):
	TEST_PASS = False
	print u"期望的系統盤型別是高效雲盤，但實際選中是%s" %(diskType)

if(TEST_PASS):
	print 'SUCCESS 從官網跳到控制檯dc2建立頁，選中了對應的配置'
else:
	print 'FAIL 從官網跳到控制檯dc2建立頁，未選中了對應的配置'

time.sleep(3)
driver.close()
```
如果有如下輸出，則測試失敗，需要我們手動進入對應頁面檢視預設選中項的情況：

```
(venv) ➜  ~ python test.py
Success our dashboard login
Opening our target page
期望的系統盤型別是高效雲盤，但實際選中是普通雲盤
FAIL 從官網跳到控制檯dc2建立頁，未選中了對應的配置
(venv) ➜  ~ 
```

如果有如下輸出，則透過測試：
```
(venv) ➜  ~ python test.py
Success our dashboard login
Opening our target page
Opened the dc2 add page
SUCCESS 從官網跳到控制檯dc2建立頁，選中了對應的配置
(venv) ➜  ~
```

## 六、後記

我們知道，Selenium 是一個很優秀的 Web 框架，提供了很豐富的 API，使用它結合進行做 Web 的自動化測試真的很完美。

但是在實際的情況中，理想與現實總是存在那麼一點距離，這點距離主要是難維護，難維護的最核心是頁面元素經常改變，測試過程中資料很多，不知道怎麼進行維護，頁面元素確實經常改變，很難改變。另外一個就是資料問題，比如我們驗證 N 個表單在不同輸入情況下的提示資訊，會有不同的提示資訊，都得需要驗證。

本文為減少重複勞動而對自動化測試所做的一個探索，專業的自動化測試肯定會封裝的更加易用，可讀，可維護。斷言，日誌都會用更加專業的框架。

期待自動化測試可以為[滴滴雲](https://www.didiyun.com/?channel=14302)的穩定性出一份力。

## 七、參考連結

Selenium 官網：[https://www.seleniumhq.org](https://www.seleniumhq.org "https://www.seleniumhq.org")

滴滴雲控制檯 Selenium 自動化測試初探

相關文章