SeleniumHQ 介紹
SeleniumHQ 是一套網頁測試工具,運作的原理為透過 JavaScript 在瀏覽器中直接執行腳本,測試的效果就如同使用者操作頁面,模擬程度相當高。由於 SeleniumHQ 是採用 JavaScript 進行腳本的執行,因此可以輕易的在不同的瀏覽器執行測試腳本,而不必對腳本進行任何修改。在腳本的製作上 SeleniumHQ 提供了 Selenium IDE (FireFox Plugin) 來錄製腳本,大幅提高腳本製作的便利性。但是經過測試以後,假如你對腳本的要求比較高的話,還是需要手動修改錄製後的腳本,效果會最好。 SeleniumHQ 官方網站如下:
安裝 Selenium Core
請在官方網站下載 Selenium Core,網址如下:
http://seleniumhq.org/download/
將下載後的檔案解壓縮,取出 core 目錄中所有的檔案,將這些檔案複製到你的網頁目錄中。
其中 TestRunner.html 這一支檔案就是主程式的入口,執行後可以看見以下畫面。
到這裡你已經安裝好 Selenium Core 了,接下來繼續安裝 Selenium IDE 來建構我們需要的測試腳本。
安裝 Selenium IDE (FireFox Plugin)
Selenium IDE 是一個 FireFox Plugin,可提供我們錄製網頁操作腳本。然而 Selenium IDE 本身也實作了 TestRunner,因此也可以直接在 Selenium IDE 上執行測試腳本。安裝方式也很簡單,請開啟 FireFox 點選官方網站的 Selenium IDE Download 連結,就直接可以進行安裝了,畫面如下:
安裝後可在工具列中啟動 Selenium IDE,如下圖:
Selenium IDE 畫面如下,下面繼續說明如何建立測試案例
Selenium 測試腳本建立
測 試腳本由 Test Suite 與 Test Case 兩項單位組成,這些測試案例都採用檔案的方式儲存,其內容為 HTML 並且採用 TABLE 的方式設計資料格式,因此你也可以手動編輯腳本。Test Suite 包含許多 Test Case,這樣的概念運用在許多測試框架上。一個 Test Suite 內容如下,下面的 Test Suite 裡包含了兩個 Test Case。
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta content="text/html; charset=UTF-8" http-equiv="content-type" /> <title>Test Suite</title> </head> <body> <table id="suiteTable" cellpadding="1" cellspacing="1" border="1"> <tbody> <tr> <td><b>Test Suite</b></td> </tr> <tr> <td><a href="TestCase1.html">TestCase1</a></td> </tr> <tr> <td><a href="TestCase2.html">TestCase2</a></td> </tr> </tbody> </table> </body> </html>
錄製 Test Case 的方法很簡單,之要先選擇左邊要錄製的 Test Case,然後按下紅色的錄製按鈕,接著直接在 ForeFox 進行操作,腳本就會自動錄製了。如下圖:
然而 Test Case 與 Test Suite 相同皆是大同小異的資料格式,以下範例為網頁登入所錄製的腳本。
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head profile="http://selenium-ide.openqa.org/profiles/test-case"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="selenium.base" href="https://www.google.com/" /> <title>TestCase2</title> </head> <body> <table cellpadding="1" cellspacing="1" border="1"> <thead> <tr> <td rowspan="1" colspan="3">TestCase2</td> </tr> </thead> <tbody> <tr> <td>open</td> <td>login.html</td> <td></td> </tr> <tr> <td>type</td> <td>Email</td> <td>iamsj</td> </tr> <tr> <td>type</td> <td>Passwd</td> <td>iamsj</td> </tr> <tr> <td>clickAndWait</td> <td>signIn</td> <td></td> </tr> </tbody> </table> </body> </html>
要 執行腳本也很簡單,只要按下綠色的開始按鈕就會進行模擬。這樣的動作也可以藉由 TestRunner.html 所提供的 Web 介面執行,因此設計出的腳本可以同時帶到不同的瀏覽器進行測試,而不需要另外安裝任何外掛,只要能夠執行 JavaScript 的瀏覽器就能夠執行線上測試了。測試功能有一個調整時間的捲軸,作用在控制每個動作觸發的時間,當你的測試腳本寫的很完美時,可以使用最短的測試延遲時間 也能夠順利進行。
2 comments for “SeleniumHQ 網站測試工具介紹與教學”