> 本文節(jié)選自霍格沃茲測(cè)試學(xué)院內(nèi)部教材
混合應(yīng)用測(cè)試或微信小程序測(cè)試滞详，都會(huì)涉及到 WebView 組件犬辰，這節(jié)內(nèi)容將分析一下 WebView 的技術(shù)原理眯勾。首先通過(guò)日志分析查看 Appium
的運(yùn)行過(guò)程。
WebView日志分析??
要想查看 ChromeDriver 的日志，需要在 Capability 里開(kāi)啟 一個(gè)開(kāi)關(guān)項(xiàng) `showChromedriverLog`擂送。讓 Appium
運(yùn)行測(cè)試用例時(shí)能夠生成 ChromeDriver 相關(guān)的日志（默認(rèn)是不打印 ChromeDriver 這部分日志的）。代碼如下：
? *?
? ? capabilities['showChromedriverLog'] = True
啟動(dòng) AppiumServer 并將生成的所有日志存儲(chǔ)到文件 `/tmp/appium.log` 中：
? *?
? ? appium -g /tmp/appium.log
關(guān)鍵日志分析??
###??
###??
下面我們對(duì) `/tmp/appium.log` 文件中的關(guān)鍵日志進(jìn)行詳細(xì)的分析。首先找到 Context 切換的日志求类，發(fā)現(xiàn) Context 切換到
`WEBVIEW_io.appium.android.apis` 上下文中：
###??
? *? ?*? ?*?
? ? [HTTP] <-- GET /wd/hub/session/xx/contexts 200 99 ms - 145[HTTP] --> POST /wd/hub/session/xx/context \{"name":"WEBVIEW_io.appium.android.apis"}
Appium 在本地開(kāi)啟了兩個(gè) WebView 進(jìn)程，進(jìn)程號(hào)分別是 1271 和 26060屹耐。
? *? ?*? ?*? ?*? ?*?
? ? [debug] [AndroidDriver] WEBVIEW_1271 mapped to pid 1271[debug] [AndroidDriver] Getting process name for webview[debug] [ADB] Getting connected devices...[debug] [AndroidDriver] WEBVIEW_26060 mapped to pid 26060[debug] [AndroidDriver] Getting process name for webview
然后尸疆，Appium 通過(guò)使用 adb 命令來(lái)查看 1271 和 26060 的進(jìn)程信息。
? *? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*?
? ? [debug] [ADB] Running '/Users/xxxx/profile/android-sdk_r2.4.1-\macosx/android-sdk-macosx/platform-tools/adb' with args: ["-P",5037,\"-s","192.168.56.101:5555","shell","ps"][debug] [AndroidDriver] Parsed pid: '1271' pkg: 'cn.goapk.market' from[debug] [AndroidDriver]? ? ?USER? ? ?PID? ?PPID? VSIZE? RSS? ? ?\WCHAN \? ?PC? ? ? ? ?NAME[debug] [AndroidDriver]? ? ?u0_a58? ? 1271? 192? ?606848 53268 \ffffffff b76c707b S cn.goapk.market[debug] [AndroidDriver] Returning process name: 'cn.goapk.market'[debug] [AndroidDriver] Parsed pid: '26060' pkg: 'io.appium.android.\apis'\ from[debug] [AndroidDriver]? ? ?USER? ? ?PID? ?PPID? VSIZE? RSS? ?\? WCHAN? ? PC? ? ? ? ?NAME[debug] [AndroidDriver]? ? ?u0_a139? ?26060 192? ?649076 68004\ ffffffff b76c6371 R io.appium.android.apis[debug] [AndroidDriver] Returning process name:\ 'io.appium.android.apis'
Appium Server 列出通過(guò)進(jìn)程查找到的所有 WebView 和可用 Context惶岭，如下：
? *? ?*? ?*? ?*?
? ? [debug] [AndroidDriver] Found webviews: ["WEBVIEW_cn.goapk.market",\"WEBVIEW_io.appium.android.apis"][debug] [AndroidDriver] Available contexts: ["NATIVE_APP",\"WEBVIEW_cn.goapk.market","WEBVIEW_io.appium.android.apis"]
然后 Appium Server 嘗試連接 ChromeDriver寿弱，由于我們沒(méi)有設(shè)置 ChromeDriver 的端口，所以 Appium Server
默認(rèn)啟用 8000 端口與 WebView 通訊按灶。Appium Server 通過(guò) ChromeDriver 與 app WebView 通訊症革。
? *? ?*? ?*?
? ? [debug] [AndroidDriver] Connecting to chrome-backed webview context\ 'WEBVIEW_io.appium.android.apis'[debug] [AndroidDriver] A port was not given, using random port: 8000
然后，Appium 先殺掉 ChromeDriver 這個(gè)進(jìn)程兆衅，清理 adb 映射端口數(shù)據(jù)地沮，如下：
? *? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*?
? ? [debug] [Chromedriver] Killing any old chromedrivers, running: \pkill -15 -f "/usr/local/lib/node_modules/appium/node_modules/\_appium-chromedriver@3.1.3@appium-chromedriver/chromedriver/mac/\chromedriver.*--port=8000"[Chromedriver] No old chromedrivers seemed to exist[debug] [Chromedriver] Cleaning any old adb forwarded port socket \connections[debug] [ADB] List forwarding ports[debug] [ADB] Running '/Users/xxx/profile/android-sdk_r24.4.1-macosx\/android-sdk-macosx/platform-tools/adb' with args: ["-P",5037,"-s","192.168.56.101:5555","forward","--list"]
到這步是真正開(kāi)啟 ChromeDriver 服務(wù)，建立起 Appium Server 與 ChromeDriver 之間的通訊羡亩。
? *? ?*? ?*? ?*?
? ? [Chromedriver] Spawning chromedriver with: /usr/local/lib/\node_modules/appium/node_modules/_appium-chromedriver@3.1.3@\appium-chromedriver/chromedriver/mac/chromedriver --url-base=wd/hub \--port=8000 --adb-port=5037 --verbose
建立連接之后摩疑，Appium Server 先查看 ChromeDriver 版本號(hào)。
? *?
? ? [debug] [Chromedriver] Chromedriver version: '2.33.506106'
ChromeDriver 打印啟動(dòng)日志畏铆，開(kāi)始傳輸參數(shù)雷袋。
? *? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*?
? ? [debug] [Chromedriver] [STDOUT] Starting ChromeDriver 2.33.506106 \(8a06c39c4582fbfbab6966dbb1c38a9173bfb1a2) on port 8000[debug] [Chromedriver] [STDOUT] Only local connections are allowed.[debug] [JSONWP Proxy] Proxying [GET /status] to [GET\ http://127.0.0.1:8000/wd/hub/status] with no body[debug] [JSONWP Proxy] Got response with status 200:\ "{\"sessionId\":\"\",\"status\":0,\"value\":{\"build\":{\"version \":\"alpha\"},\"os\":{\"arch\":\"x86_64\",\"name\":\"Mac OS X\", \"version\":\"10.12.6\"}}}"[debug] [JSONWP Proxy] Proxying [POST /session] to [POST \http://127.0.0.1:8000/wd/hub/session] with body: {"\desiredCapabilities"\:{"chromeOptions":{"androidPackage":\"io.appium.android.apis","androidUseRunningApp":true,"androidDeviceSerial":"192.168.56.101:5555"}}}
通過(guò) ps 命令列出手機(jī)的進(jìn)程列表，從中查找 WebView辞居。
? *? ?*? ?*?
? ? [Chromedriver] [STDERR] [0.349][DEBUG]: \Sending adb command: \host:transport:192.168.56.101:5555|shell:ps && ps -A
通過(guò)進(jìn)程列表獲取 WebView 的進(jìn)程號(hào)楷怒，Appium 根據(jù)這些信息操作 WebView。
? *? ?*? ?*? ?*?
? ? Chromedriver] [STDERR] [0.365][DEBUG]: \Sending adb command: \host-serial:192.168.56.101:5555:forward:tcp:12531;\localabstract:webview_devtools_remote_26060
查看WebView??
###??
###??
WebView 控件會(huì)被映射為原生控件瓦灶，類(lèi)型為 View鸠删，其中的文本內(nèi)容會(huì)變成 content-desc（Android 6.0）或者
text（Android 9.0）。
打開(kāi)雪球 APP贼陶，下面命令可以查看 Android 系統(tǒng)內(nèi)的 WebView 進(jìn)程：
? *? ?*? ?*? ?*?
? ? Hogwarts $ adb shell cat /proc/net/unix | grep webview0000000000000000: 00000002 00000000 00010000 0001 01 12863 /dev/socket/webview_zygote0000000000000000: 00000002 00000000 00010000 0001 01 24703 @webview_devtools_remote_17580000000000000000: 00000003 00000000 00000000 0001 03 24672 /dev/socket/webview_zygote
上面的命令中刃泡，凡是名字前面有 `@` 的都是套接字巧娱。套接字(Socket)是對(duì)網(wǎng)絡(luò)中不同主機(jī)上的應(yīng)用進(jìn)程之間進(jìn)行雙向通信的端點(diǎn)的抽象。
下面命令查看這個(gè)進(jìn)程對(duì)應(yīng)的應(yīng)用：
? *? ?*? ?*?
? ? Hogwarts $ adb shell ps |grep 1758??
? ? u0_a67? ? ? ? 1758? ?211 1600592 333680 futex_wait_queue_me f016fbb9 S com.xueqiu.android
查看到是雪球 APP 的 WebView 進(jìn)程烘贴。測(cè)試時(shí)禁添，Appium Server 就利用這個(gè)端口實(shí)現(xiàn)與 WebView 的通訊。??
Context切換??
###??
###??
由于直接操作套接字很難桨踪，所以使用 adb forward 將它重定向到本地端口老翘。
? *?
? ? adb forward tcp:$port localabstract:webview_devtools_remote_$pid
例如：使用本地 7777 端口
###??
? *?
? ? Hogwarts $ adb forward tcp:7777 localabstract:webview_devtools_remote_1758
可以發(fā)送 http 請(qǐng)求實(shí)現(xiàn)相關(guān)操作，下面獲取 WebView 組件版本（也可以直接在瀏覽器中訪問(wèn)
`http://localhost:7777/json/version`）锻离，命令如下：
? *? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*?
? ? Hogwarts $ curl http://localhost:7777/json/version{? ?"Android-Package": "com.xueqiu.android",? ?"Browser": "Chrome/74.0.3729.186",? ?"Protocol-Version": "1.3",? ?"User-Agent": "Mozilla/5.0 (Linux; Android 8.1.0; Google Pixel_1 Build/OPM6.171019.030.E1; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/74.0.3729.186 Mobile Safari/537.36",? ?"V8-Version": "7.4.288.28",? ?"WebKit-Version": "537.36 (@99fc61ba7ee9c511608e5ea11edc2622ba3b8e3f)",? ?"webSocketDebuggerUrl": "ws://localhost:7777/devtools/browser"}
Chrome 的 devtools 協(xié)議是遠(yuǎn)程調(diào)試協(xié)議（https://chromedevtools.github.io/devtools-
protocol/）
http://127.0.0.1:7777/json/list 可以直接獲取 devtoolsFrontendUrl 查看調(diào)試的遠(yuǎn)程重定向的頁(yè)面詳細(xì)信息铺峭。
? *? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*? ?*?
? ? [? ? {? ? ? ? "description": "{\"attached\":true,\"empty\":false,\"height\":1605,\"screenX\":0,\"screenY\":189,\"visible\":true,\"width\":1080}",? ? ? ? "devtoolsFrontendUrl": "http://chrome-devtools-frontend.appspot.com/serve_rev/@99fc61ba7ee9c511608e5ea11edc2622ba3b8e3f/inspector.html?ws=127.0.0.1:7777/devtools/page/06840BED58C1415235EFC9817FFD472E",? ? ? ? "faviconUrl": "https://assets.imedao.com/broker/static/images/favicon.8d2e0522.png",? ? ? ? "id": "06840BED58C1415235EFC9817FFD472E",? ? ? ? "title": "平安證券 極速開(kāi)戶(hù)",? ? ? ? "type": "page",? ? ? ? "url": "https://broker.xueqiu.com/open/pingan?snb_from=tab",? ? ? ? "webSocketDebuggerUrl": "ws://127.0.0.1:7777/devtools/page/06840BED58C1415235EFC9817FFD472E"? ? },? ? ...
然后訪問(wèn)Chrome的調(diào)試頁(yè)面 `chrome://inspect/#devices`，就可以獲取到頁(yè)面元素信息汽纠，從而完成對(duì)元素的定位逛薇。
### appium WebView技術(shù)原理就先講到這，大家有什么問(wèn)題或疑問(wèn)都可以在下方留言給我哦疏虫！
###
?** _?
來(lái)霍格沃茲測(cè)試開(kāi)發(fā)學(xué)社，學(xué)習(xí)更多軟件測(cè)試與測(cè)試開(kāi)發(fā)的進(jìn)階技術(shù)啤呼，知識(shí)點(diǎn)涵蓋web自動(dòng)化測(cè)試 app自動(dòng)化測(cè)試卧秘、接口自動(dòng)化測(cè)試、測(cè)試框架官扣、性能測(cè)試翅敌、安全測(cè)試、持續(xù)集成/持續(xù)交付/DevOps惕蹄，測(cè)試左移蚯涮、測(cè)試右移、精準(zhǔn)測(cè)試卖陵、測(cè)試平臺(tái)開(kāi)發(fā)遭顶、測(cè)試管理等內(nèi)容，課程技術(shù)涵蓋bash泪蔫、pytest棒旗、junit、selenium撩荣、appium铣揉、postman、requests餐曹、httprunner逛拱、jmeter、jenkins台猴、docker朽合、k8s俱两、elk、sonarqube旁舰、jacoco锋华、jvm-sandbox等相關(guān)技術(shù)，全面提升測(cè)試開(kāi)發(fā)工程師的技術(shù)實(shí)力
QQ交流群：484590337
公眾號(hào) TestingStudio
視頻資料領(lǐng)燃堋：https://qrcode.testing-studio.com/f?from=jianshu&url=https://ceshiren.com/t/topic/15844
