背景
在做移动端UI自动化时，获取布局元素的信息是一个非常常用的工作，所以找一个比较稳定且高效的工具是非常重要的事。比较常见的有3种工具，简单说一下。
1.uiautomatorviewer
Android端之前比较流行的使用是Android SDK下自带的uiautomatorviewer，这个缺点是只能查看Android布局，而且如果id不唯一时，通过xpath定位还要自己去一层一层的去算xpath定位，比较耗时。当然后来网上出了二次开发版，可以替换jar包，然后在获取布局信息的时候可以直接给出xpath信息，但是这个缺点是对于某些控件的获取会有问题，不是很稳定。
综合评定：优点无，缺点不稳定，耗时，无法支持IOS。
2.Appium Inspector
优点：1.安装环境比较简单，Mac端的话只要下载个Appium桌面版，下载个Android SDK，就可以查看Android的布局了，重新编译build WebDriverAgent在IOS设备上安装即可实现Appium与IOS设备间的通讯。2.稳定性上也算可以接受。3.可以支持IOS和Android。
缺点：1.当ID不唯一时，不能给出最简化的xpath，也需要自己去精简一下2.对于IOS设备稍微不是很友好，耗时稍长
3. Macaca App Inspector
阿里开源的Macaca框架中的一个小工具。
优点：1.比较稳定，响应速度较快 2.可以给出最简化的xpath信息以及元素xpath的绝对路径3.可以支持IOS和Android
缺点：依赖环境较多，安装较耗时。
本人3种都用过，对比起来还是比较喜欢Macaca Inspector。但是安装过程坑还是挺多的，下面讲一下详细的安装步骤，mark一下也方便我以后查看嘿嘿~
Macaca App Inspector安装详细步骤
官网地址：https://macacajs.github.io
1. cnpm：
- 更新npm到最新版：
sudo npm install npm@latest -g
- 验证npm版本
npm -v
- 为了方便以后下载东西先把npm搞成淘宝的镜像cnpm，具体用法见 http://npm.taobao.org/ 。
2. node.js:
node.js需要版本貌似是9以上，所以需要确保一下node.js的版本。
- 先查看本机node.js版本：
node -v
- 清除node.js的cache：
sudo cnpm cache clean -f
- 安装 n 工具，这个工具是专门用来管理node.js版本的，别怀疑这个工具的名字，是他是他就是他，他的名字就是 "n"
sudo npm install -g n
- 安装最新版本的node.js
sudo n stable
- 再次查看本机的node.js版本：
node -v
3.Macaca命令行工具
- 全局安装
cnpm i -g macaca-cli
如果看到如下可爱的🐒，那恭喜你安装成功啦！重新安装则会覆盖更新。
安装inspector
$ npm install app-inspector -g
4.IOS环境
- 请安装 Xcode9 或者更高版本
- 请安装 usbmuxd 以便于通过 USB 通道测试 iOS 真机，不需要测试真机则不用安装
brew install usbmuxd
- 请安装 ideviceinstaller 用来给真机安装 App。
brew install ideviceinstaller
- 应用中如含有 WebView，请安装 ios-webkit-debug-proxy
brew install ios-webkit-debug-proxy
- 安装IOS驱动
cnpm i macaca-ios -g
备注：使用brew命令需要安装Homebrew（一款常用的 MacOS 的包管理器）
5.IOS真机环境
-
打开XCTestWD
打开finder，然后按快捷键commend+shift+G 输入/usr/local/lib/node_modules/app-inspector/node_modules/xctestwd/XCTestWD，前往，用xcode打XCTestWD.xcodeproj文件
XCTestWD.xcodeproj文件.png -
重新自定义Bundle ID以及Team ID,每个文件都需要更改Bundle ID以及Team ID，如下图
id1.png
id2.png
id3.png
id4.png
id5.png
id6.png -
重新编译XCTestWDUITests
build.png
提示build success即可。
将 TEAM_ID 通过环境变量传入覆盖安装iOS驱动
DEVELOPMENT_TEAM_ID=TEAM_ID cnpm i macaca-ios -g
注意此处的TEAM_ID要填写Xcode的TEAM_ID代码，即是这样的格式
DEVELOPMENT_TEAM_ID=xxxxxxxx cnpm i macaca-ios -g
查询方法如下图
点击“other”，然后显示下图，copy红框内代码即可
- 将 TEAM_ID 通过环境变量传入覆盖安装App Inspector
DEVELOPMENT_TEAM_ID=TEAM_ID cnpm install app-inspector -g
注意修改TEAM_ID ！！！
6.安装Android环境
1.安装JDK以及SDK，不会的请自行百度。
2.安装 gradle 来构建 UIAutomatorWD 和其它依赖包。 ( Windows 用户请安装 gradle 安装包 并且设置对应的环境变量。)
brew install gradle
3.安装Android驱动
cnpm i macaca-android -g
7.检查Macaca安装环境
macaca doctor
如果是一片绿，那么恭喜你环境OK了。
8.命令行执行App Inspector
app-inspector -u UDID --verbose
UDID如何查询没请自行百度。执行后浏览器自动打开地址：http://192.168.1.111:5678/ （推荐用 Chrome 浏览器）
出现下图代表成功了。
9.题外话之命令行唤起xcode模拟器
- 方法一：
1.IOS模拟器列表获取命令
xcrun instruments -s
2.IOS启动模拟器命令
xcrun instruments -w "iPhone 8 (12.1)"
- 方法二：
1.安装IOS-SIM包
sudo cnpm install -g ios-sim
2.检验安装是否成功
ios-sim showdevicetypes
3.启动IOS模拟器
ios-sim start --devicetypeid iPhone-8
如何仅仅是为了查看IOS布局推荐使用模拟器，模拟器的udid也是可以在xcode中查询的。唤起办法个人推荐方法二，因为我自己的电脑用第一个不是很稳定。
