如今，大多數的應用軟件被寫為基于 Web 的應用程序并通過瀏覽器展示給用戶并與之進行交互。不同公司和機構組織都需要測試這些應用程序的有效性。在一個高度交互性和響應的軟件流程時代，許多組織傾向于運用敏捷開發理論，自動化測試也就成了必備一項。所謂自動化測試，就是執行自動測試工具或者用某種程序設計語言編寫程序，控制被測軟件中的各種模塊，模擬手動測試步驟，完成測試。測試自動化有很多優點，比如：頻繁的回歸測試、快速反饋給開發人員、幾乎無限的重復測試用例的執行、支持敏捷和極端發展的方法、自定義的缺陷報告、不會錯過人工手動測試可能遺漏的缺陷等。目前也有很多商業和開源的軟件，可以輔助進行測試自動化的開發。Selenium 應該是應用最為廣泛的開源解決方案。

Selenium 概述

Selenium 是一個用于 Web 應用程序測試的工具，Selenium 測試直接自動運行在瀏覽器中，就像真正的用戶在手工操作一樣。支持的瀏覽器包括 IE、Chrome 和 Firefox 等。這個工具的主要功能包括：測試與瀏覽器的兼容性 - 測試您的應用程序看是否能夠很好地工作在不同瀏覽器和操作系統之上；測試系統功能 - 創建回歸測試檢驗軟件功能和用戶需求；支持自動錄制動作，和自動生成 .NET、Perl、Python、Ruby 和 Java 等不同語言的測試腳本。Selenium 是 ThoughtWorks 專門為 Web 應用程序編寫的一個驗收測試工具。

Selenium 2.0 與以往版本的區別

Selenium 2.0（又名 Selenium WebDriver）的主要新功能是集成了 WebDriver。WebDriver 曾經是 Selenium 1（又名 Selenium RC）的競爭對手。Selenium RC 在瀏覽器中運行 JavaScript 應用，而 WebDriver 通過原生瀏覽器支持或者瀏覽器擴展直接控制瀏覽器。

從 Selenium 項目簡史中可以了解到，Selenium 和 WebDriver 的開發人員都認為兩個工具各有優勢，二者合并將創造更強大的 Web 測試框架。 Selenium 1 是一款流行和完善的測試框架，支持眾多瀏覽器（因其 JavaScript 實現），允許用戶通過許多編程語言（從 Java/C# 到 PHP、Erlang...），而 WebDriver 則彌補了 Selenium 1 的缺點，跳出了 JavaScript 的沙箱，提供快速、輕量級的瀏覽器模擬器。之所以合并，原因如下：

• WebDriver 解決了 Selenium 存在的缺點（比如，繞過 JS 沙箱）；
• Selenium 解決了 WebDriver 存在的問題（例如支持廣泛的瀏覽器）;
• Selenium 的主要貢獻者們都覺得合并項目是為用戶提供最優秀框架的最佳途徑。

Selenium 2.0 還包括 Selenium Server，通過 Selenium Grid 支持分布式測試。新的 Selenium Grid 支持使用原來的 Selenium RC API 和 WebDriver API 測試。Selenium IDE 1.1.0 也將支持 WebDriver API，包括將錄制生成的測試用例導出為 WebDriver 所支持的各種編程語言（Ruby、Python、C# 和 Java）。

WebDriver 針對各個瀏覽器而開發，取代了 Selenium RC 中嵌入到被測 Web 應用中的 JavaScript，與瀏覽器的緊密集成可以支持創建更高級的測試，且避免了 JavaScript 安全模型導致的限制。除了來自瀏覽器廠商的支持，WebDriver 還利用操作系統級的調用模擬用戶輸入。WebDriver 支持 Firefox (FirefoxDriver)、IE (InternetExplorerDriver)、Opera (OperaDriver) 和 Chrome (ChromeDriver)。它還支持 Android (AndroidDriver) 和 iPhone (IPhoneDriver) 的移動應用測試。此外，還包括一個基于 HtmlUnit 的無界面實現，即 HtmlUnitDriver。WebDriver API 可以通過 Python、Ruby、Java 和 C# 訪問，支持開發人員使用他們偏愛的編程語言來創建測試。

Selenium 的安裝配置

Selenium IDE 的安裝

Selenium IDE 是一個 Firefox 插件，是用來開發測試用例的集成開發工具，其簡單易用，能夠高效的開發測試用例，并可轉換成相應的語言腳本。

首先，使用 FireFox，訪問 Selenium HQ?下載頁面來下載 Selenium IDE：

圖 1. Selenium IDE 下載頁面

點擊查看大圖

Firefox 對于一個不信任的插件可能會彈出一個提示，因此需要點擊“允許”按鈕來繼續安裝。當下載完成時，會彈出如下頁面：

圖 2. 安裝 Selenium IDE

點擊安裝按鈕，安裝完成后會提示重啟瀏覽器，完成該操作，Selenium IDE 即安裝完畢。如下圖所示：

圖 3. Selenium IDE

Selenium 開發環境

首先，在如上下載頁面中下載 Selenium WebDriver 運行時可能需要的各種類包：

• Selenium server 2.25
• Selenium Client Drivers – Java
• Selenium Internet Explorer Driver Server – Needed when using IE mode
• Selenium Chrome driver

本文的集成開發環境選用 Eclipse Java EE IDE Juno ，具體配置如下所示：

圖 4. Eclipse 開發環境配置

需要添加 Junit 4 library、Selenium java driver（Selenium-java-2.25.0.jar）、Selenium server（Selenium-server-2.25.0.jar）、其余 jar 包為 Selenium java driver 的依賴類，位于 Selenium java driver zip 包中的 lib 文件夾中。

至此，Web 應用程序的自動化測試開發環境配置完畢。

Selenium WebDriver 常用操作

Selenium WebDriver 能夠模擬日常的瀏覽器操作，其中最常用的操作如下：

訪問頁面

與頁面交互

填寫表單

提交頁面內容

檢查頁面元素是否在頁面上

在窗口和 Frame 之間移動

彈出對話框

頁面導航

下面本文將通過一個比較完整的示例分別介紹如上所示常用操作的具體應用。代碼片段如下：

清單 1. WebDriver 常用操作

123456789101112131415161718192021222324252627282930313233

1.public void setUp() throws Exception { 2.??? //driver = new HtmlUnitDriver(); 3.???? driver = new FirefoxDriver(); 4.???? baseUrl = "http://www.baidu.com/"; 5.???? driver.manage().timeouts().implicitlyWait(30, TimeUnit.SECONDS); 6.} 7. 8.@Test 9.public void testDemo() throws Exception { 10.??? driver.get(baseUrl + "/"); 11.??? driver.findElement(By.id("kw")).clear(); 12.??? driver.findElement(By.id("kw")).sendKeys("百度翻譯"); 13.??? driver.findElement(By.id("su")).click(); 14. 15.??? WebElement element; 16.??? element = driver.findElement(By.id( "op_tran_text" )); 17.??? //element = driver.findElement(By.xpath( "//textarea[@id= ’ op_tran_text ’ ]" )); 18.??? element.clear(); 19.??? element.sendKeys("自動化測試"); 20. 21.??? WebElement select = driver.findElement(By.xpath( "//select" )); 22.??? List<WebElement> allOptions = select.findElements(By.tagName( "option" )); 23.??? for (WebElement option : allOptions) { 24.??????? System.out.println(String.format( "Value is: %s" , \?????????????????option.getAttribute("value"))); 25.??????? if(option.getText().equals("zh2en")) 26.??????????? option.click(); 27.??? } 28. 29.??? driver.findElement(By.xpath("//a[@class='op_tran_btn OP_LOG_BTN']")).click(); 30.??? 31.driver.switchTo().window( "百度在線翻譯" ); 32.}

清單第 2-3 行定義了所使用的 webdriver 類型，本部分以 HtmlFirefoxDriver 為例：

1	WebDriver driver = new HtmlFirefoxDriver();

對于其他類型的 driver，其操作是一樣的，不同 driver 的區別在于模擬何種類型的瀏覽器。

頁面導航

如清單第 10 行所示：

1	driver.get(baseUrl + "/");

完全裝載頁面后將控制返回給測試腳本。

注意：當頁面又很多 Ajax 調用時，該接口無法確認頁面是否完全裝載，這是需要使用"waits"。

與頁面交互

如清單第 11-12、15-19 行所示。

例如：

1234567891011

<input type= "text" name= "passwd" id= "passwd-id" /> WebElement element; element = driver.findElement(By.id( "passwd-id" )); element = driver.findElement(By.name( "passwd" )); element = driver.findElement(By.xpath( "//input[@id= ’ passwd-id ’ ]" )); //XPATH 返回第一個匹配到的元素，如果沒有匹配到，拋出 NoSuchElementException element.sendKeys( "some text" ); element.sendKeys( " and some" , Keys.ARROW_DOWN); // 按向下箭頭 ; 任何頁面元素都可以調用 sendKeys，??????????????????????????????????//例如可以測試一些快捷方式鍵，鍵盤的每次輸入都是附加在文本串的后面；element.clear(); // 清除文本域內容

填寫表單

如清單 21-27 行所示。

• 處理 SELECT 標簽

  123456

  WebElement select = driver.findElement(By.xpath( "//select" )); List<WebElement> allOptions = select.findElements(By.tagName("option" )); for(WebElement option : allOptions) { ????System.out.println(String.format( "Value is: %s" , option.getValue())); ????option.setSelected(); }

• 使用 Select 類處理 SELECT 標簽

  123	Select select = new Select(driver.findElement(By.xpath( "//select" ))); select.deselectAll(); select.selectByVisibleText("Edam");

提交

如清單第 13、29 行所示。

12	driver.findElement(By.id( "submit" )).click(); element.submit();// 要求 element 必須在表單中，否則拋出 NoSuchElementException

檢查元素是否在頁面上

檢查元素是否在頁面上是最常用的操作之一，具體用法如下：

12	WebElement plain = driver.findElement(By.name( "q" )); RenderedWebElement element = (RenderedWebElement) element;// 例如 HtmlUnit Driver 就無法顯示出內容

對元素拖拉：

12345

RenderedWebElement element = (RenderedWebElement) driver.findElement(\???????????????????????????????????????????????????????By.name( "source" )); RenderedWebElement target = (RenderedWebElement) driver.findElement(\???????????????????????????????????????????????????????By.name( "target" )); element.dragAndDropOn(target);

在窗口和 frame 之間移動

如清單第 31 行所示

• 在命名的窗口之間移動

  1	driver.switchTo().window( "windowName" ); // 可以通過 js 或者打開窗口的鏈接獲取窗口名稱

• 通過窗口句柄切換

  123	for (String handle : driver.getWindowHandles()) { ????driver.switchTo().window(handle); }

• frame 之間切換或者切換到 iframe

  1234	driver.switchTo().frame( "frameName" ); 通過索引訪問 subframe：driver.switchTo().frame( "frameName.0.child" );//frameName 的第一個 subframe ???????????????????????????????????????????????//的明價 child 的 frame

彈出對話框

窗口彈出后，可以使用如下語句訪問到彈出窗口：

1	Alert alert = driver.switchTo().alert();

獲取到 alert 窗口后，可進行各種操作。

頁面導航

navigate().to() 和 get() 功能完全一樣。

1	driver.navigate().to( "http://www.example.com" );

瀏覽器的前進和后退 :

12	driver.navigate().forward(); driver.navigate().back();

注意這兩個方法取決于瀏覽器的實現，可以會出現某些調用失敗。

結合 Selenium IDE，用實例展示自動化測試的構建

本部分將結合實際案例來展示自動化測試的構建。

Selenium IDE 使用和腳本轉換

打開 FireFox 瀏覽器，如上圖 3 所示，打開 Selenium IDE 窗口：

圖 5. Selenium IDE 窗口

下面開始錄制第一個基于瀏覽器的自動化腳本：

點擊 File 菜單，彈出下拉列表，選擇 New Test Case，此時左中部 Test Case 窗口會增加一個 Untitle 2 的測試案例，右鍵點擊'Property'，在彈出窗口中重命名為”TestDemo”

點擊 IDE 的右上部錄制按鈕（小紅點）開始手動錄制，在 FireFox 中打開新的 tab 頁，輸入測試網址 www.baidu.com，在檢索框中輸入要查詢的內容“Selenium”，點擊“百度一下”按鈕；

在結果頁，第一條結果就是 Selenium 的官方網站，點擊鏈接進入；

待進入 Selenium 官方網站之后，切換到 Selenium IDE 窗口，點擊錄制按鈕（小紅點），結束本次手動錄制；此時 Selenium IDE 窗口如下圖 6 所示；

點擊 File 菜單，選擇“Save Test Case”，填寫文件名稱“TestDemo”，手動錄制的腳本會存為本地 HTML 格式文件，此文件可以在其他 Selenium IDE 中導入使用；

有了以上錄制的腳本，可以在 Selenium 中回放，選擇 TestDemo 腳本，點擊中上部的“Play current test case”按鈕（第二個綠色三角按鈕），此時，瀏覽器會按照錄制的順序自動操作執行。由此可見，Selenium IDE 在 Web 應用測試中，可以代替人的大量手工操作。

圖 6. 腳本錄制

紅色方框所圈定的部分即為 Selenium 的操作記錄，此處也可以手動添加、刪除、更改命令。

有了手動錄制的腳本，可以轉換成多種語言的程序腳本：

在 selenium IDE 中，選中一個 Test Case，點擊 File 菜單，下拉列表中選擇“Export Test Case As”-“Java / Junit 4 / WebDriver”;

在彈出的保存窗口中，輸入類名稱 TestDemo，保存；TestDemo.java 文件生成。對于生成的 java 自動化測試腳本，有些可能不能成功執行，需要手動稍微調整。

編寫第一個 Selenium 自動化測試腳本

打開上述所配置的 Eclipse 開發環境，新建一個 Java 工程，將上述轉換而成的 TestDemo.java 文件導入到該工程中，去除冗余的“Organize Import(Ctrl + Shift + O) ”。如圖 7 所示：

圖 7. 集成開發環境中的代碼

代碼第 21 行可見，自動導出的代碼默認采用 FireFox 瀏覽器。執行此代碼，Selenium 會自動觸發開啟 FireFox 瀏覽器，打開一個新的頁面，進入百度首頁，在檢索框中自動輸入“Selenium”關鍵字，自動點擊“百度一下”按鈕，進入搜索結果頁面，定位到第一條檢索結果，然后點擊進入 Selenium 官網，自動關閉瀏覽器，此時 Eclipse 開發環境，JUnit 結果頁面顯示出來，如圖 8 所示：

圖 8. 自動化運行結果

不同版本的 WebDriver 實現跨瀏覽器測試

實現跨瀏覽器測試，關鍵在于中選擇哪種 WebDriver。

對于 IE 和 Chrome 瀏覽器

在此以 IE 瀏覽器為例，更新圖 7 所示代碼第 21 行為 driver = new InternetExplorerDriver();

運行更新后的自動化腳本，selenium 自動啟動 IE 瀏覽器進行自動化測試。如圖 9 所示：

圖 9. IE 瀏覽器自動化測試

對于模擬瀏覽器

Selenium 中提供了 Java 實現的虛擬瀏覽器，選用此驅動，程序會模擬瀏覽器的行為進行測試，測試過程中并無實際瀏覽器被調用。

更新 driver = new HtmlUnitDriver(); 運行該腳本，所有瀏覽器行為在后臺模擬運行。

結束語

綜上所述，本文由淺入深，由 Selenium WebDriver 的基本概念著手，詳細闡述其與以往版本的不同之處，并結合實際案例，展示了 Selenium 實現 Web 應用自動化測試的過程。用戶按照本文介紹的步驟和方法，即可構件出第一個自動化測試案例。隨著學習的深入，相信基于 Selenium WebDriver 的自動化測試應用到實際項目中，一定能夠極大提高工作效率。

相關主題

• Selenium 官方網站：Selenium 的權威站點，提供項目介紹、官方文檔、在線資源下載和支持等。
• 利用 Selenium 自動化 web 測試：詳細介紹了 Selenium 1 對于 Ajax 頁面的相關操作。
• 使用 Selenium RC 測試 web 應用程序：介紹了 Selenium 1 的自動化測試構件過程。
• developerWorks Web development 專區：通過專門關于 Web 技術的文章和教程，擴展您在網站開發方面的技能。
• developerWorks Ajax 資源中心：這是有關 Ajax 編程模型信息的一站式中心，包括很多文檔、教程、論壇、blog、wiki 和新聞。任何 Ajax 的新信息都能在這里找到。
• developerWorks Web 2.0 資源中心，這是有關 Web 2.0 相關信息的一站式中心，包括大量 Web 2.0 技術文章、教程、下載和相關技術資源。您還可以通過?Web 2.0 新手入門?欄目，迅速了解 Web 2.0 的相關概念。
• 查看?HTML5 專題，了解更多和 HTML5 相關的知識和動向。

總結

以上是生活随笔為你收集整理的Web 应用程序的自动化测试的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。