ant: normal; text-transform: none; padding-bottom: 7px; line-height: 16px; color: rgb(51, 51, 51); ">過去一年中,使用 AJAX (Asynchronous JavaScript And XML) 技術的 Web 應用程序越來越受到用戶的推崇。與非 AJAX Web 應用程序相比,正確編寫的 AJAX Web 應用程序可顯著提升性能和改善用戶體驗。但由于 AJAX Web 應用程序采用的是異步工作模式,因而傳統同步測試自動化技術在此處通常便無用武之地。在本月的專欄中,我將介紹一項技術,利用該技術您便可編寫小型測試自動化軟件,以此來驗證 AJAX Web 應用程序的功能。
就我而言,向您傳達本專欄中所述觀點的最佳方法是借助一些屏幕快照。圖 1 是一個使用了 AJAX 技術的簡單但極具代表性的 ASP.NET Web 應用程序。該應用程序模擬映射工具,如 Microsoft® Windows Live™ Local。當用戶單擊某定向按鈕控件時,該應用程序會從 Web 服務器中提取適當的映射圖像,然后在中心區域中顯示新映射。不太容易從屏幕快照中看出的是 Web 應用程序使用 Microsoft ASP.NET AJAX 以異步方式發送和檢索映射圖像。當然,您的 Web 應用程序會更為復雜,但我將向您介紹的技術適用于任何復雜的應用程序,并可用于任何啟用 AJAX 的應用程序,不論實施何種技術。
手動測試圖 1 中的應用程序是一件既費時低效又枯燥乏味的差事。更好的測試方法是編寫小型測試自動化軟件,如圖 2 所示。這種測試工具是由兩個框架構成的簡單的 HTML 頁面。右側框架是 Web 應用程序的宿主,用戶未進行任何修改或檢測。左側框架是含有 JavaScript 代碼的單個 HTML 頁面的宿主,JavaScript 代碼可使用 Internet Explorer® 文檔對象模式 (DOM) 在另一個框架中處理 Web 應用程序。
雖然該測試技術是專用于處理使用異步操作的應用程序,但此技術也可用于使用傳統同步 HTTP 請求/響應機制的 Web 應用程序。在本專欄中,我將簡要介紹一下待測試的 Web 應用程序,從而使您了解傳統測試自動化技術對 AJAX 應用程序無效的原因。然后,我將詳細說明生成圖 2 中的圖像的測試工具,并說明如何才能修改和擴展此處介紹的技術以滿足您自己的需求。最后,我相信您會發現這項技術是對開發人員和測試人員技能要求的一個有用補充。
.gif)
圖 1 待測試的 AJAX Web 應用程序 (單擊該圖像獲得較大視圖)
待測試的 Web 應用程序
我使用 ASP.NET AJAX 代碼庫(極大地簡化了 AJAX 應用程序的創建過程)創建了如圖 1 所示的 AJAX 映射應用程序。我沒有使用真正的映射圖像,而僅使用了從數字 1 到數字 9 的九個虛擬圖像,圖像名稱依次為 1.jpg 到 9.jpg。(有關使用 Microsoft TerraServer 來獲取真正的映射圖像的示例,請參閱本期中 Jeff Prosise 關于“超酷代碼”專欄。)縮圖區域由 3 行 3 列的網格構成,第一行為 1、2 和 3,第二行為 4、5 和 6,第三行為 7、8 和 9。5 是該區域的中心,并且如果用戶從 5 單擊“北”控制按鈕,則應用程序應顯示 2!氨薄卑粹o的邏輯如圖 3 所示。

.gif)
圖 2 測試運行示例 (單擊該圖像獲得較大視圖)
延伸閱讀
文章來源于領測軟件測試網 http://www.kjueaiud.com/