一：背景
在使用appium進行app端自動化測試的時候，一般使用的是uiautomatorviewer來給頁面元素做定位。但如果遇到頁面元素類型是webview的時候，則只能定位整個頁面，而不能更進一步定位頁面內容，這通常是不方便的。經過一番搜索，發現可以使用谷歌瀏覽器的inspect功能來實現類似功能，該功能一般用於調試前端代碼。
二.功能
我們先看下最終想要達到的效果
上圖的左邊是手機上的chrome 截圖，可以看到，當鼠標移動到某個span上時，手機上的這個區域高亮顯示，右邊則實時顯示的是對應的html源碼。 這跟pc上調試某段代碼效果一樣， 你可以修改代碼，並直接在手機上反饋修改結果。
三，准備
為了完成這一亮騷的移動調試功能我們需要以下准備工作
1.pc端安裝最新的chrome
2.手機端安裝最新的chrome (Android機)
3.USB連接線
（感覺是不是too simple）
Tip:之前的的chrome如果要實現這種調試需要安裝一個ADB插件（需要FQ） 但是最新的chrome已經直接支持對Android的識別 所以也不用再在chrome上安裝ADB插件了 但需要下載最新的chrome
四：步驟
下來我們逐步完成
1.假設你已經在電腦上下載了最新的chrome 也在手機上下載了最新的chrome
2.USB設置 在你的手機里打開"設置"->"開發人員工具"->"USB調試" 打開USB調試。 因為Android手機型號眾多 很多人找不到"USB調試這個選項在哪" 而且大多數手機"開發者選項"默認是影藏的，你需要看下自己的手機說明然后將手機調到"開發者模式" 就可以找到 "USB調試了"
3.假設你已經將手機設置為"USB調試"打開的狀態 將手機連接到電腦 手機會彈出是否鏈接 點擊確定
4.打開電腦的chrome 在地址欄輸入 chrome://inspect 選中 Discover USB devices 可以檢測到你的設備 可以看到監測到我的設備是SM-N9009。接着用chrome打開需要調試的頁面
6.點擊inspect 如下圖 就看到了文章開始一樣的效果 此時就是可以審查手機頁面上的元素了
7.可以點擊彈出的審查元素框右上角的方形小圖標切換到視圖模式 這時會把你手機打開的頁面拉到pc上顯示
五：總結
基本上已經愉快的完成了 總結下整個流程 ：pc端和Android手機端都下載最新的chrome ，在手機設置里將"USB調試"打開 鏈接到電腦 打開電腦chrome 輸入chrome://inspect 打開手機chrome輸入你想調試的頁面 點擊inspect 開始調試 。
備注：在首次點擊inspect的過程中，可能會遇到頁面空白，內容不能加載的情況，這個是因為chrome被牆了，需要合理使用工具翻過去，推薦使用搬瓦工+ss。