App Inspector-iOS真機功能詳解

前言:

App Inspector:瀏覽器端的移動設備 UI 查看器,使用樹狀態結構查看 UI 佈局,自動生成 XPaths。官網:https://macacajs.github.io/app-inspector/cn/node


本次教程僅支持iOS,Macios


1、環境安裝:

一、安裝Node.jsgit

brew install nodegithub

二、安裝macacachrome

npm i -g macaca-clinpm

三、安裝 ideviceinstaller xcode

brew install ideviceinstaller瀏覽器

四、安裝 usbmuxdapp

brew install usbmuxdide

五、安裝iOS驅動

npm i macaca-ios -g

六、安裝App Inspector

npm install app-inspector -g


2、安裝XCTestWD

一、進入App Inspector安裝目錄下XCTestWD文件夾,具體路徑參照本身的路徑,能夠經過find命令查找。

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

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

三、每一個文件修改Bundle id和添加Team,請按下圖操做步驟更改。Bundle id可自定義。image.pngimage.pngimage.pngimage.pngimage.png四、項目文件直接編譯,test結尾的文件build for Testing。編譯成功便可。


3、將 TEAM_ID 經過環境變量傳入覆蓋安裝App Inspector、iOS驅動

一、獲取你的TEAM_ID ,見下圖。image.png
二、覆蓋安裝iOS驅動

DEVELOPMENT_TEAM_ID=TEAM_ID npm i macaca-ios -g

3 、覆蓋安裝App Inspector

DEVELOPMENT_TEAM_ID=TEAM_ID npm install app-inspector -g


4、使用App Inspector
一、獲取測試機uuid,並執行如下命令:

app-inspector -u DEVICE-ID

二、chrome瀏覽器自動打開地址:http://192.168.21.101:5678/ (推薦用 Chrome 瀏覽器)image.png
三、點擊頁面元素,便可獲取元素xpath,name
四、若切換頁面,需如今手機上切換,而後刷新瀏覽器,則獲取手機的最新頁面。


以上~

相關文章
相關標籤/搜索