App Inspector-iOS真機功能詳解

前言:

App Inspector:瀏覽器端的移動設備 UI 查看器,使用樹狀態(tài)結構查看 UI 布局,自動生成 XPaths。官網(wǎng):https://macacajs.github.io/app-inspector/cn/


本次教程僅支持iOS,Mac


一、環(huán)境安裝:

1、安裝Node.js

brew install node

2、安裝macaca

npm i -g macaca-cli

3、安裝 ideviceinstaller

brew install ideviceinstaller

4、安裝 usbmuxd

brew install usbmuxd

5、安裝iOS驅動

npm i macaca-ios -g

6、安裝App Inspector

npm install app-inspector -g


二、安裝XCTestWD

1、進入App Inspector安裝目錄下XCTestWD文件夾,具體路徑參照自己的路徑,可以通過find命令查找。

cd /usr/local/lib/node_modules/app-inspector/node_modules/xctestwd/XCTestWD

2、用xcode打開XCTestWD.xcodeproj文件
image.png

3、每個文件修改Bundle id和添加Team,請按下圖操作步驟更改。Bundle id可自定義。
image.png
image.png
image.png
image.png
image.png

4、項目文件直接編譯,test結尾的文件build for Testing。編譯成功即可。


三、將 TEAM_ID 通過環(huán)境變量傳入覆蓋安裝App Inspector、iOS驅動

1、獲取你的TEAM_ID ,見下圖。
image.png

2、覆蓋安裝iOS驅動

DEVELOPMENT_TEAM_ID=TEAM_ID npm i macaca-ios -g

3 、覆蓋安裝App Inspector

DEVELOPMENT_TEAM_ID=TEAM_ID npm install app-inspector -g


四、使用App Inspector
1、獲取測試機uuid,并執(zhí)行以下命令:

app-inspector -u DEVICE-ID

2、chrome瀏覽器自動打開地址:http://192.168.21.101:5678/ (推薦用 Chrome 瀏覽器)
image.png

3、點擊頁面元素,即可獲取元素xpath,name
4、若切換頁面,需現(xiàn)在手機上切換,然后刷新瀏覽器,則獲取手機的最新頁面。


以上~

?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容