手機網頁前端除錯工具
一、Eurda
進行移動端網頁開發時，想要檢視手機瀏覽器資訊從來都不是一件容易的事。特別是當目標環境為APP內建WebView，需要呼叫特定的JsBridge介面時，你根本都幹不了什麼，只能一遍又一遍地修改程式碼，重新開啟頁面並alert一下。你可能會說，可以使用Chrome，Firefox連線手機除錯啊！但那樣限定於使用相應的手機版瀏覽器，意義並不大。Weinre，Vorlonjs跟debugGap等工具實際上也並不好用，初始化過於繁瑣，而且僅能調調樣式，打打log，斷點除錯什麼的也沒有辦法支援。每次測試出現問題，基本上只能屁顛屁顛地跑過去拿手機過來連線自己的本地環境改程式碼查bug。
二、UI Recorder
UI Recorder是一款零成本的整體自動化測試解決方案，一次自測等於多次測試，測一個瀏覽器等於測多個瀏覽器！
以下是本產品的特點：
-
自測 = 自動化測試：對於開發人員來講，自測是開發流程中缺一不可的過程，我們要實現的目標就是自測過程中即可同步的錄製出自動化指令碼，實現真正的零成本自動化
-
無干擾錄製：所作操作均無需互動干擾，滑鼠、鍵盤、alert彈框、檔案上傳，完全按照正常自測流程操作即可(以下操作除外：懸停事件、斷言、變數)
-
本地生成指令碼：錄製的指令碼儲存在使用者本機，使用者可以自行在錄製的基礎上進行修改定製，更自由更開放
-
豐富的斷言：支援以下斷言型別，val、text、displayed、enabled、selected、attr、css、url、title、cookie、localStorage、sessionStorage
-
支援強大變數：我們支援配置式變數、更新變數、斷言中使用變數、跳轉時使用變數
-
支援資料Mock：我們支援Faker變數功能，支援強大的資料Mock
-
支援公共用例: 用例之間允許相互引用，可以將某些公用的操作步驟錄製為公用用例，以進一步提升錄製效率
-
支援高併發測試：支援任意數量的高併發，想跑多快就跑多快
-
支援單步執行截圖：每一步操作都自動儲存截圖，以方便出問題時排查診斷
三、AlloyLever
AlloyLever是騰訊AlloyTeam團隊開源的一款Web 開發除錯工具。
功能：
-
點選alloylever按鈕之間切換顯示或隱藏工具面板
-
Console會輸出所有使用者列印的日誌如console.[log/error/info/debug/debug]
-
Console會輸出所有的錯誤資訊(指令碼錯誤和網路請求錯誤)
-
XHR面板會輸出所有（XMLHttpRequest）AJAX請求和伺服器端返回的資料
-
Resouces面板會輸出所有的Cookie資訊和LocalStorage
-
TimeLime面板會輸出頁面相關的生命週期裡的時間段耗時情況
通過npm安裝：
npm install alloylever
使用
在你的頁面任何地方引用下面指令碼就可以，但是該js必須引用在其他指令碼之前。
<script src="alloylever.js"></script>
務必記住，該js必須引用在其他指令碼之前！！
四、vConsole
vConsole是一款由微信公眾平臺前端團隊打造的前端除錯面板，專治手機端看log難題。
目前vConsole自帶有2個面板，預設為“日誌”面板，負責展示log。
更多：