Macaca App Inspector,阿里开源的Macaca框架中的一个小工具。App Inspector 是运行在浏览器端的移动设备 UI 查看器,使用树状态结构查看 UI 布局,并且能自动生成 XPath,方便脚本的编写和生成。
优点:1.比较稳定,响应速度较快 2.可以给出最简化的xpath信息以及元素xpath的绝对路径3.可以支持IOS和Android
缺点:依赖环境较多,安装较耗时。
1. 安装node(v9以上才行)、npm------较新版本的node安装后,会附带npm工具。
$ brew install node
$ node -v 、npm -v
2. 安装 n 工具
这个工具是专门用来管理node.js版本的,别怀疑这个工具的名字,是他是他就是他,他的名字就是 "n"
$ sudo npm install -g n
3.Macaca命令行工具
$ cnpm i -g macaca-cli
如果看到如下可爱的🐒,那恭喜你安装成功啦!重新安装则会覆盖更新。
4.IOS环境
a. 请安装 Xcode9 或者更高版本
b. 请安装 usbmuxd 以便于通过 USB 通道测试 iOS 真机,不需要测试真机则不用安装
$ brew install usbmuxd
c. 请安装 ideviceinstaller 用来给真机安装 App。
$ brew install ideviceinstaller
d. 应用中如含有 WebView,请安装 ios-webkit-debug-proxy
$ brew install ios-webkit-debug-proxy
e. 安装IOS驱动
$ cnpm i macaca-ios -g
备注:使用brew命令需要安装Homebrew(一款常用的 MacOS 的包管理器)
5.IOS真机环境
a. 打开XCTestWD并配置证书
// 方法:打开finder,然后按快捷键commend+shift+G 输入/usr/local/lib/node_modules/macaca-ios/node_modules/_xctestwd@1.4.22@xctestwd/XCTestWD/XCTestWD.xcodeproj,前往,用xcode打开XCTestWD.xcodeproj文件
// 版本不同路径就会有所区别,如果找不到,在访达里搜索XCTestWD.xcodeproj即可找到;
重新自定义Bundle ID以及Team ID,每个文件都需要更改Bundle ID(加个后缀即可)以及Team ID(免费的个人账号及收费的开发者账号都可以),如下图所示圈住的内容都要改下:
重新编译XCTestWDUITests
b. 将 TEAM_ID 通过环境变量传入覆盖安装iOS驱动
$ DEVELOPMENT_TEAM_ID=LZMQ4YGMKZ cnpm i macaca-ios -g
// 注意此处的TEAM_ID要填写Xcode的TEAM_ID代码
// TEAM_ID查询方法如下图,点击other,copy红框内代码即可:
c. 将 TEAM_ID 通过环境变量传入覆盖安装App Inspector(注意修改TEAM_ID !!!)
$ DEVELOPMENT_TEAM_ID=LZMQ4YGMKZ cnpm install app-inspector -g
6.安装Android环境
a. 安装JDK以及SDK
https://www.jianshu.com/p/ded56c627c2f
https://www.jianshu.com/p/fca1efddb595
b. 安装gradle
用来构建UIAutomatorWD和其它依赖包。
$ brew install gradle
c. 安装Android驱动
$ cnpm i macaca-android -g
7.检查Macaca安装环境
$ source .bash_profile
// 如果不限执行环境变量配置文件生效,则检查时会提示jdk和sdk未配置 (点击查看问题解决)
// bash_profile在个人账号下即默认打开的终端位置下执行
$ macaca doctor
// ⚠️遇到问题1: 如果已经安装了jdk和sdk且配置了环境变量但是提示没有,则执行下$ source .bash_profile。
//⚠️遇到问题2: 如果macaca doctor提示 Not accepted Android SDK license agreements,如下图所示:
-----解决:在android-sdk目录下在新建一个licenses文件夹,并创建一个文件为android-sdk-license的文件名,内容为8933bad161af4178b1185d1a37fbf41ea5269c55 ------实践可行。
cd /Users/Cathleen/Library/Android/sdk/android-sdk-macosx
mkdir licenses
cd licenses
touch android-sdk-license
open android-sdk-license
然后再次执行检查如果是一片绿,那么恭喜你环境OK了。
8.命令行启动App Inspector
$ app-inspector -u UDID --verbose
//eg:app-inspector -u 103fc866d685f37dae974ca9cffa7262451d6383 --verbose
// UDID如何查询:https://www.jianshu.com/p/0dcc141662af。
// 获取ios simulator模拟器的udid ----$ xcrun simctl list
9.浏览器访问App Inspector
浏览器打开地址上图中的server地址即可(推荐用 Chrome 浏览器)。
eg:http://192.168.11.91:5678/ ,ip一般不变,端口貌似是每次都变。
如果出现下图所以,则说明成功啦
10、遇到问题
⚠️App Inspector访问时提示Waiting Device start...,且此时终端返回200并没有报错哎
----原因分析:终端中报错( process.env.MACACA_XCTESTWD_ROOT_PATH
undefined) 、版本兼容性问题、
----解决:
Cathleen@bogon ~ % app-inspector -u 103fc866d685f37dae974ca9cffa7262451d6383 --verbose
>> port: 5678 was occupied, changed port: 5680
>> server.js:16:12 [master] pid:54558 server start with config:
{
port: 5680,
verbose: true,
udid: '103fc866d685f37dae974ca9cffa7262451d6383',
ip: '192.168.11.91',
host: 'bogon',
loaded_time: '2020-01-03 21:10:36'
}
>> app-inspector.js:45:12 [master] pid:54558 server start at: http://192.168.11.91:5680
process.env.MACACA_XCTESTWD_ROOT_PATH
undefined
>> xctest-client.js:56:14 [master] pid:54558 project path: /usr/local/lib/node_modules/app-inspector/node_modules/_xctestwd@1.4.22@xctestwd/XCTestWD/XCTestWD.xcodeproj
>> xctest-client.js:283:14 [master] pid:54558 xcode version: 11.3
>> XCTestWD version: 1.4.22
>> xctest-client.js:230:20 [master] pid:54558 please check project: /usr/local/lib/node_modules/app-inspector/node_modules/_xctestwd@1.4.22@xctestwd/XCTestWD/XCTestWD.xcodeproj
>> xctest-client.js:230:20 [master] pid:54558 please check project: /usr/local/lib/node_modules/app-inspector/node_modules/_xctestwd@1.4.22@xctestwd/XCTestWD/XCTestWD.xcodeproj
>> xctest-client.js:230:20 [master] pid:54558 please check project: /usr/local/lib/node_modules/app-inspector/node_modules/_xctestwd@1.4.22@xctestwd/XCTestWD/XCTestWD.xcodeproj
>> xctest-client.js:322:14 [master] pid:54558 killing runnerProc pid: 54561
>> xctest-client.js:242:16 [master] pid:54558 xctest client exit with code: 65, signal: null
<--GET/
-->GET/ 200
<--GET/
-->GET/ 200
<--GET/