一張圖帶你玩轉H5測試……6大模組測試點彙總分享！

一提到H5測試，做WEB測試的朋友肯定早已經非常熟悉，它包括頁面H5功能測試，前端效能測試，瀏覽器相容效能測試，以及服務端效能測試。今天我們來一起了解下H5測試的測試點，希望可以幫助大家瞭解：如何進行H5頁面的測試，如何發現問題以及相應的最佳化規則。

H5頁面的測試點彙總：

業務邏輯相關 
除基本的功能測試之外，H5頁面的測試，需要關注以下幾點：

1、登陸

目前H5與native各個客戶端都做了互通，所以大家在測試的時候要注意兩點：

A、若客戶端已登入，那麼進入H5後仍然是登入狀態。

B、若客戶端未登入，進入H5，點選對應按鈕OR連結，如果需要登入，須拉起native登入。若取消登入，是否可再次拉起登入，或者停留在的頁面是否有對應的登入提示。

ps：本次測試過程中就發現，第一次點選連結，可以拉起登入，第二次卻不能。

2、翻頁

遇到翻頁載入的頁面，需要注意內容為1頁或者多頁的情況。

A、資料分頁載入時，注意後續頁面請求資料的正確。

ps：這個需要注意在快速操作場景中，請求頁數是不是依次遞增，快速操作（如第一頁尚未loading出來的時候仍然繼續上拉操作）時是否發出去對應的請求了。

3、重新整理與返回

A、下拉重新整理是否仍然處於當前頁面。

B、使用者主動點選重新整理按鈕是否仍然處於當前頁面。

C、點選返回與back鍵，回退頁面是否是期望頁面

ps：本次測試過程中就發現，mtop介面請求成功，但是data內無資料時，返回到的就是個空白頁面，無法正常傳送請求。

4、 mtop介面返回處理

發現這個出現問題的地方有很多，但是隻要有意識的去處理，就很容易避免，主要是以下幾種情況：

A、請求成功，且返回有資料，測試mtop介面返回資料的各種場景。

B、請求成功，但data內容為空。

C、請求介面異常，出現ERR_SID_INVALID::SESSION過期，拉起登入。

D、請求介面發生除C中提到的異常之外的異常，通常可歸結為一類進行處理。

H5適配相關

H5的適配其實比客戶端的相對來說，要少一些，手機品牌之間的差異不大，所以不用太多關注，最容易出現問題的系統，這個要特別關注下：

A、大屏（如720*1280，重點關注頁面背景是否完全撐開頁面，重新整理是否有抖動）、小屏手機（如320*480，重點關注下彈框樣式和文案折行）

B、android4.X隨機找一個即可。

C、ios9、ios8、ios7。

網路相關

不同網路型別測試

a)考慮2G\3G\4G\wifi網路

b)考慮行動網路2G\3G\4G基站的變化的影響

c)無連線、關閉連線狀態

d)弱網路訊號狀態

e)有網路訊號但網路不可達狀態

測試注意點

a)從wifi切換到2G/3G網路、從2G/3G網路切換到wifi等

b)弱網路降級：處於2G/3G網路省流量模式的一些特殊處理，比如2G網路下測試，圖片多時是否要懶載入等

c)無網路時，執行需要網路的操作，給予友好提示，並確保不會導致應用crash；

d)內網測試時，要注意選擇到外網操作是的異常情況處理；

e)弱網路下，檢查功能狀態是否正常，確保不因提交資料失敗而造成異常甚至應用crash；

f)弱網路下，檢查資料是否一直處於提交中的狀態，如遇資料交換失敗要給予提示；

g)弱網路下，執行操作後，在回撥沒有完成的情況下，退出本webview或者其他操作，有無異常

安全相關

1、明確投放渠道都有哪些

如獨客、主客、wap，是否對未投放渠道做了限制，直接透過url請求是否攔截等

2、評估是否需要接入集團安全，如mtee黑白名單等。

3、是否需要接入支付寶實名認證

涉及到金錢相關，如天貓積分，紅包等，為了防刷，一般都需要判斷是否支付寶實名認證。

4、是否接入windvane，所有請求透過native發出。

操作頁面體驗相關

1、資源相關

A、頁面中有圖片的話，淘寶那邊建議圖片一般不大於50kb，本著一個原則，儘量縮小圖片。

B、資源是否壓縮、是否透過CDN載入。

C、如何保證二次釋出後有效更新。

2、流量

A、對於一些不會變化的圖片，如遊戲動畫效果相關圖片，不需要每次都請求的東西，做本地快取。

B、資料較多時是否做了分頁載入。

3、頁面展現時間

A、關注頁面首屏載入時間。

4、頁面提示

A、弱網路下，資料載入較慢，是否有對應的loading提示。

B、介面獲取異常時，提示是否友好。

C、重新整理頁面或者載入新內容時頁面是否有抖動。

5、手機操作相關

A、鎖屏之後展示頁面。

B、回退到後臺之後，重新撥出在前臺展示。 　

埋點資料檢查

與BI、前端同學一起確認埋點情況。

總結：

隨著科技的進步，H5頁面的普及和運用正深深的影響著每個行業的發展，我們可以發現在各種各樣的App，都從Native APP往Hybird APP發展，比如微信、手機淘寶、支付寶等重量級應用，都在多個入口嵌入了H5，因此，H5的測試需求也是非常大的。

廢話少說，最後給大家分享一個小乾貨——一張圖玩轉H5測試，其目的在於，當一個測試員拿到一個H5的測試任務時，可以引導你怎麼去思考來完整的測試你的業務。