Android之讓跨浏覽器測試 Web 應用程序變得簡單

簡介： 一直以來，“對多個浏覽器進行測試” 像是一條難以解開的咒語，因為需要對大量浏覽器進行測試。對所有浏覽器進行測試（尤其是目前）幾乎是不可能的。但是這比您想象中的要容易很多。本文將介紹各種實現跨浏覽器測試的技術，既包括比較全面的技術，也包括便捷但不嚴謹的技術。您必須要面對的一個問題就是，需要根據自己的資源進行選擇。

我們都知道（我們也應該 知道），需要在多個浏覽器和操作系統中測試我們的 Web 應用程序。但這個任務常常是理論上行得通卻難於付諸實現。用戶可能會使用各種各樣的浏覽器和操作系統組合來訪問您的站點，而要實現一整套完整的跨浏覽器測試則可能對您的開發資源造成不小的損耗。

什麼？除了 IE 還有這麼多浏覽器？

21 世紀早期的開發人員可能只需要對 Internet Explorer 進行測試，但是這些日子已經一去不復返了。如今，IE 占據了大約 80% 的浏覽器訪問量。這個數字非常龐大，但並不具有絕對優勢 — 當然，沒有公司會將 20% 的用戶群拱手與人。

您也不要妄想您的用戶使用的浏覽器特性可以反映大部分 Internet 用戶的習慣。根據國家和興趣的不同，使用浏覽器和操作系統的的習慣也不盡相同。很多站點都針對特定的用戶群，這些站點的用戶很可能使用的是非 Windows 操作系統和 Internet Explorer 以外的浏覽器。例如，訪問 developerWorks 站點的訪客中，60% 的人使用 Internet Explorer，而 35% 的人使用 Firefox。特別是 Web 開發專區，使用 Firefox 的人數多達 51%，而只有 41% 的訪客使用 Internet Explorer。

幸運的是，一些工具和技巧可以使跨浏覽器測試變得稍微簡單一些 — 並且開銷也更低。在本文中，您將了解各種可用於測試的策略；根據您的需求和資源，您可以找到最適合自己的策略。我將首先介紹一些比較全面的測試技術，如果資源和時間的限制使您無法實現所需的測試，本文還將介紹一些替代方法。

浏覽器的小花招

附加功能

請記住，並不是所有人都可以在其浏覽器上啟用很多 Web 應用程序所依賴的兩種技術 — Flash 和 Javascript。對於本文介紹的技術，不管您的最終選擇是什麼，都應該在打開和關閉 JavaScript 和 Flash 的情形下進行測試（很多托管服務提供了一種簡單的方法來啟用這些選項）。對 cookie 也是如此 — 關閉 cookIE、清除，執行所有可能的操作來模擬訪問站點的浏覽器的可能狀態。

無疑，JavaScript 是 Ajax 應用程序的基礎。對 Ajax 代碼進行跨平台測試稍微有些困難；關鍵在於，越接近真實的用戶體驗，硬件或浏覽器模擬層越少，測試效果就越好。跨浏覽器調試 AJax 應用程序比較復雜，並且使用搜索引擎正確地進行索引也很困難，這兩大原因阻礙了這種應用程序的廣泛應用。有關更多信息，請參考 參考資料中的鏈接，其中包括 developerWorks AJax 資源中心的鏈接。

跨多個浏覽器和操作系統進行測試，最顯而易見、最全面（當然成本也最高）的方法就是對多個浏覽器和操作系統進行實際測試。從很多方面講，浏覽器是測試過程中最簡單的部分，因為大多數主流浏覽器都是免費的。盡管如此，請記住，您將進行測試的不僅僅是幾種不同的浏覽器，還包括同一 浏覽器的各種版本。作為開發人員，您通常都會在自己的計算機中使用最新最好的浏覽器版本 — 這也是出現 “對多個浏覽器進行測試” 這一咒語的原因之一 — 但是，快速查看一下站點的浏覽器統計信息，您就會發現，並不是所有用戶都像您一樣。

目前，同時運行同一種浏覽器的多個版本比較困難，因為大多數浏覽器的安裝過程都覆蓋了以前的所有版本。還好，有一些解決方法。對於 Firefox，可以將每個浏覽器的可執行文件保存為不同的名字，然後確保首次啟動各個版本時啟用配置文件管理程序，這樣就不會共享這些配置文件。圖 1 展示了同時運行的兩個 Firefox 浏覽器版本 — 最新的 2.0.0.10 發行版和比較陳舊的 0.7 版本。

圖 1. 同時運行的多個 Firefox 版本
 
 

對於 Internet Explorer，這個過程要稍微復雜一些。Windows 實際上 不希望您這樣做；為了應對它的 “抵制”，您需要對注冊表設置進行一些調整。一家小型軟件公司 TreDOSoft 發布了一款可以安裝多個 IE 版本的免費工具，以及能夠正確調整注冊表鍵和 DDL 的指令，該公司因此而獲得了廣泛關注；請查看 參考資料 中的鏈接（其中還包含我即將介紹到的其他工具和擴展的鏈接，但是我以及 developerWorks 不會對這些鏈接進行擔保）。

進行實際測試

不僅應該使用不同配置對各種浏覽器進行測試，測試計算機（或者，適當規模的企業中受信任的遠程用戶測試程序）也應該有自己的 Internet 連接。換而言之，不要忘記測試真實的連接，這樣便不會由於本地加載圖片和腳本而影響測試准確性。盡可能多地添加真實世界中的因素 彈出窗口和廣告攔截程序、個人防火牆和用戶可能在其浏覽器中使用的所有其他軟件，這些因素都會影響頁面的顯示方式；也可以幫助您更好地理解真實終端用戶的體驗。University of Washington 的 Web Tripwire Toolkit（參見 參考資料）可以幫助您了解由於其他干擾而非浏覽器實現引起的古怪問題。

當然，在設置並運行所有這些浏覽器之前，需要知道從哪裡獲得它們！比如，Microsoft® 不會在其網站上提供 Internet Explorer 5 的下載，並且在 Mozilla Foundation 頁面您也不一定能獲得 Firefox 1.0，這些都是老版本。幸運的是，積極的 Web 用戶們為舊的可執行文件創建了檔案文件。evolt.org 上由自願者推動的 Web 社區提供了大量各種風格的舊版浏覽器，包括 IE、Opera 等等，但是缺少最新的 Mozilla 發行版；這些可以在諸如 filehippo.com 及類似的文件聚合站點找到，您可以很輕松地找到這些站點。對於 Apple 的 Safari，開發者喜愛的 Multi-Safari 項目將早期的 Safari 版本進行了打包，因此可以方便地實現並行運行（參加 參考資料 中有關內容的鏈接）。

節省屏幕空間

處理多個浏覽器時可能遇到的一個實際問題就是如何避免窗口混亂。雖然，很多時候無法避免，但是您至少可以通過兩種方便的工具來稍微整理一下。IE Tab 是一種 Firefox 插件，允許您在一個 Firefox 選項卡中運行一個 Internet Explorer 實例。這並不是模擬 — 它確實使用了 IE 呈現引擎，這意味著您看到的內容就是您在 Explorer 中實際獲得的內容，但是，這也意味著只能在 Windows 中工作。圖 2 展示了它的實際效果。

圖 2. 使用 IE Tab
 
 

RightLynx 是一種針對 Internet Explorer 和 Firefox 的插件，當您右鍵單擊時將彈出一個窗口，顯示當前頁面在 Lynx 中的顯示狀態，因此您不必始終打開活動的終端窗口；一個 Web 服務將在 Lynx 中加載頁面並將結果文本發送回您的計算機。這些工具都是免費的，並且安裝簡單，您可以在 參考資料 一節找到相關鏈接。

Lynx：古老而又嶄新的浏覽器

當我提到 Lynx 時，您可能會大吃一驚。年輕的開發人員可能已經忘記了這個基於文本的浏覽器，它最早出現於 90 年代早期，專門針對 UNIX® 命令行（但是也有針對 DOS、Windows 等的版本）。圖 3 展示了使用 Lynx 訪問 Web 開發專區的界面。

圖 3. 使用 Lynx
 
 

使用 Lynx 測試站點乍一看似乎毫無意義 — 畢竟，訪問您的站點的任何人都傾向於使用流行的圖形化浏覽器。然而，Lynx 可以顯示站點的基本架構，因而能夠向最重要的站點訪客 Web 牽引程序和 spider 展示站點的近似外觀，它們能夠為搜索引擎執行站點索引，從而提供站點流量。Lynx 工具能夠確保重要的搜索項不會隱藏在 AJax 小部件之後。

虛擬化和模擬

當然，浏覽器只是測試的一部分；您也許希望跨多個操作系統進行測試。與可以免費下載到開發計算機上的浏覽器相比，操作系統的測試成本自然要高出許多。最全面的測試方法當然是對多個系統進行實際測試，包括 Windows 計算機、Mac、Linux® box 和其他需要進行測試的操作系統的物理版本。這很可能超出一年的 Web 開發預算，但是，幸運的是，可以使用一些方法將一台計算機轉化為多個測試平台。

最簡單的方法就是創建一個雙啟動設置，即將多個操作系統裝在同一台計算機上，在啟動時可以選擇所加載的系統。一般來講，操作系統都被保存在不同的硬盤分區中，但是 LiveDistros 被保存在 CD 或 thumb 驅動中，以避免硬盤驅動格式發生沖突。雙啟動過去一直用於 Linux 和其他開源版本，但是基於 x86 的 Macs 的出現意味著很多計算機現在都能夠雙啟動 Windows 和 OS X。

雙啟動的缺點是在操作系統之間進行切換需要等待很長時間。但是虛擬化則不存在這個問題，實現虛擬化後，可以同時運行多個操作系統。過去只有功能強大的服務器才能實現虛擬化，現在，只要擁有一台標准版本的桌面 PC，您就可以使用這個工具。如果您打算使用多個操作系統為用戶提供服務，那麼需要在測試計算機上實現某種形式的虛擬化。在圖 4 中，我在 Power Mac 中使用了 Virtual PC，同時在兩個操作系統中使用 4 種不同浏覽器訪問 developerWorks Web 架構專區。

圖 4. 同時運行 4 種浏覽器：OS X 上的 Safari 和 Firefox，Windows XP 上的 Firefox 和 Internet Explorer
 
 

通過使用多種工具（包括 VMWare 和 Virtual PC），您可以輕松地在所有普通 PC 上運行 Windows 和其他與 x86 兼容的操作系統。其中一個操作系統充當主機，其他系統則在虛擬化應用程序中運行。這樣，不需要重新啟動，您可以在屏幕上相鄰的窗口中，比如 Windows Vista、Windows XP 和最新的 Ubuntu 版本，測試您的應用程序。您仍然需要購買所有不同的操作系統，但至少只需要使用相同的硬件。

您可能注意到，我在上面的樣例操作系統中沒有提到 Mac OS X。很不幸，OS X 只能夠在 Mac 硬件上運行，但是可以對 Mac 使用一些虛擬化方法。因此，如果希望使用在單個機器上應用最廣泛的系統，可以考慮使用 Intel® Mac 以及針對它的兩種主要的虛擬化產品，VMWare Fusion 或 Parallels Desktop（參見 參考資料 中的鏈接）。通過使用這種設置，您可以測試 OS X、Windows、Linux 以及其他運行在 x86 硬件之上的任何操作系統。當然，這種方法的缺點就是無論硬件還是軟件都不是免費的，甚至還很貴。

移動設備測試

如果您的 Web 站點或應用程序針對的是移動用戶 — 或者您期希能夠為大量移動用戶提供服務 — 無疑，您需要對實際的移動設備進行測試。遺憾的是，與 PC 市場相比，移動設備市場非常零散，因而很難購買和維護非常穩定的物理測試設備，並且成本也較高。還好，您也可以通過桌面計算機來模擬移動平台。

很多特定的移動平台提供了免費的 SDK，包括可運行在 PC 桌面上的設備模擬程序。例如，您可以下載針對 Google android 平台的 SDK（參見 參考資料 中的鏈接）。訪問浏覽器有些難度 — 您需要在 Eclipse 開發環境中安裝 android 插件，然後啟動其中一個樣例應用程序 — 完成這些操作後，您將可以訪問基於 WebKit 的浏覽器，WebKit 開源框架是支撐 Safari 和 Nokia S60 智能手機浏覽器的基礎。圖 5 顯示了運行中的浏覽器模擬程序。

圖 5. android SDK 中的浏覽器
 
 

移動浏覽器市場也非常零散，但是很多高端智能手機現在可以使用經過修改的桌面浏覽器 — iPhone 使用 Safari，而 Opera Mobile 可以用於眾多智能手機，因此您可以直接在桌面上完成手機浏覽器測試，但是，桌面浏覽器和手機浏覽器之間的相關性並不理想（iPhoney 是一種使用 Safari 標准桌面版本的 OS X 應用程序，但是至少可以向您呈現站點在受限的 iPhone 屏幕中的顯示效果；參見參考資料 中的免費下載鏈接）。

當然，很多手機仍然需要通過受限的 WAP 訪問 Web。如果需要測試一個 WAP 站點，可以從網上獲得大量免費的 WAP 模擬程序，在浏覽器窗口中運行即可。

總之，要通過內部測試獲得廣泛的覆蓋率，移動測試是最困難的部分。但是您還有其他的選擇，我將在下一節介紹。

外包測試

看到這裡，您可能感到有些絕望。也許測試的最後期限就在明天。也許您還不太信服我剛才介紹的這些技術。或者您在時間或資金方面的預算非常緊張。或者，IT 部門不希望您在計算機中安裝舊版本的浏覽器或修改注冊表鍵。這時候，您該如何做？除了最新版的 Firefox 和 IE 外，您是否無法對其他浏覽器進行測試？

您仍然還有一種選擇：您可以通過托管服務執行測試。您需要提供一個 URL，這些服務將顯示該 URL 在各種平台上的顯示效果。您現在無法從自己的測試計算機中實際訪問某個站點，但是，只需要很低的成本就可以訪問大量平台 — 有些時候甚至不需要花一分錢。

Browsershots.org 展示了可以從這種服務的免費版本中獲得的好處。圖 6 展示了可以使用的各種選項（移動平台和 Lynx 不包括在內）。對於選中的每個框，您獲得一個 PNG 文件，它是指定的 URL 在該浏覽器/操作系統組合的顯示效果的屏幕截圖。這個過程會耗時半個小時或更長時間，因此，需要在後台運行該過程，以便可以執行其他任務，但是這個重要的測試部分是免費的。

圖 6. 對 Browsershots.org 的定制結果
 
 

如何應對長期的全面測試

如果預算充足，那麼還可以做得更好一些。例如，如果支付一個月的費用，Browsercam.com 可以使您訪問更多的平台和浏覽器 — 包括某些移動平台 — 以及一些動態頁面，允許您測試 AJax 應用程序和其他基於 JavaScript 的頁面。諸如 Litmusapp 這樣的服務可以集成到您的測試和開發流程中，提供版本化支持和方法，向外部客戶機發布測試結果。

這些服務同樣適用於移動領域，新的移動設備總是層出不窮，遠遠超過大多數人的想像。DotMobi Virtual Developer Lab 就是一種不錯的托管服務，主要針對移動測試；它可以訪問上百種不同移動設備，並且能夠通過多種方法進行操作。這些服務提供的界面與真實設備並不相同，但是大多數情況下都可以滿足您的要求；並且由於它專門針對移動設備，因此可以作為內部測試或桌面服務的補充。

結束語

理想情況下，應該對所有 Web 應用程序進行測試，以確保能夠在訪問它的所有浏覽器中正確工作。但是，鑒於浏覽器市場的紛亂復雜以及更加變幻莫測的移動平台市場的日益崛起，使得 Web 應用程序的測試更加困難。盡管如此，您仍然可以通過一些方法來簡化測試。您可以使用大量工具進行跨平台 Web 測試。無論是對工作站資源使用一些虛擬化的操作系統，或僅僅通過托管服務運行您的應用程序，您都能夠查看應用程序在不同用戶環境中的性能 — 並且您也應該對用戶負責，確保應用程序能夠在盡量多的環境中正常工作。