作者：曉月 授權本站轉載。

跨終端web

方式

• 響應式

• 多站點

• 多模板

• 多平台

mobile web

基准

核心價值

以有限的測試資源最大化測試覆蓋率

數據來源

友盟等

移動分級浏覽器支持 MGBS

• 分辨率

• 設備

• 浏覽器

分級

描述

1. 測試基准分A主要,B次之,C可選.

2. 季度更新

3. B級別也是可選,根據不同業務的實際情況選擇

4. 標記最新版本

說明

1. A級為優先級最高. 要求測試過所有的用例. 開發要按照上線標准過自測用例.

2. B級是對A級別的補充. 要求測試過所有的測試用例. 開發不要求自測.

3. C級優先級比較低, 各業務線測試測試可以抽樣測試, 不需要做到測試用例完全覆蓋,也不需要樣式完全保持一致.如果遇到具體的bug,需要可測試一起評定bug的嚴重性.在雙方認可的情況下,允許不解決C級的bug而發布代碼.

漸進增強和平穩退化

• 漸進增強: 在高級浏覽器上,作為前端,需要考慮如何理由浏覽器提供的資源, 提供更好的用戶體驗.

• 平穩退化: 平穩退化不是不做某些功能, 衛視提供一些更合適的功能, 更合適的交互給適合的平台. 不讓繁雜的功能由於不在合適的平台上使用, 而成為一個負擔.

分級目標環境 GTE

• 用戶層

• 核心層

• 數據層

檢測

User Agent的使用

接口

流程復用

InterFace(IF)

• 接口描述:請求,響應數據格式

• 接口文檔:由接口描述生成接口文檔

• 接口Mock(調試):由接口描述生成接口Mock數據

• 接口校驗:提供校驗服務(HTTP)和檢測工具包, 支持多種形式的接口校驗

解決方案

• 規范: 統一的接口規范

• 文檔: 對所有角色有約束的接口文檔

• 校驗: 數據校驗工具(UI工具和HTTP服務),後端數據UT

• 流程: 接口改動通知, 接口測試數據

JOSN Schema

描述JSON數據結構的規范

定位

方案

• Hash

• History API

數據

1. 首次訪問返回HTML, HTML由後端模板生成

2. 非首次訪問只用AJAX請求JSON(P)數據, 在前端使用同一套模板生成HTML. 這裡提到了前後端使用同一套模板, 是為了同一份邏輯在前後端維護的成本.

預覽

用一些工具改寫UA進行跨終端預覽

Hybrid App

存儲

整體方案

• 存儲方案: store.js(http://github.com/marcuswestin/store.js) –localStorage + userData

• 跨域方案: 使用iframe加載代理頁, 數據存儲在代理頁面所在的域下, 需要實現宿主與代理頁之間的通信, postMessage + windows.name

同步動作

實現

Selenium

1. 啟動Firefox浏覽器並且啟動Selenium插件

2. 啟動錄制

3. 在頁面產生交互

4. 錄制結束產生一份錄制代碼

5. Seienium Webdricer解析這個錄制代碼回放動作行為

6. 監聽頁面並記錄測試結果

腳本錄制和回放

1. PC端浏覽器

2. 操作頁面產生動作

3. PC端浏覽器手機動作並出發Socket事件

4. Mobile端浏覽器接受Socket事件, 獲取到動作數據

5. Mobile端回放動作