Macaca Inspector - View the Mobile UI in a tree view and generate XPath automatically

Macaca Inspector - View the Mobile UI in a tree view and generate XPath automatically

What is Macaca?

Macaca is an element inspector, which can be used for inspecting elements on both mobile and web, this tool is from Alibaba inc. it is helpful in inspecting elements on both android and iOS.

SetUp Macaca Tool For Mobile

  • To install the app-inspector, Node.js environment is required

    macaca-cli is recommended to install. Open terminal & run below-mentioned command.

$ npm install macaca-cli -g
  • Your environment needs to be set up for the particular mobile platforms that you want to view. Install Android SDK for Android, Xcode for iOS. Verify the environment with macaca-cli using below command
$ macaca doctor
  • If you saw some green log information, it means your platform environment is ready. if you see some Red log information for android and iOS, then this means some software is missing which u need to install. below mentioned are the software and their commands to install for iOS and Android.

Setup for iOS

For iOS Xcode v9 or higher is required. Run the below-mentioned commands in terminal to install respective software.

$ brew install usbmuxd
  • usbmuxd is needed in order to test the real iOS device via USB.
$ brew install ideviceinstaller
 $ brew install ios-webkit-debug-proxy

If you get error code 65, then navigate to below path and Open xcTestWD.xcodeproj

/usr/local/lib/node_modules/macaca-ios/node_modules/xctestwd

For macOS Mojave path would be: usr⁩ ▸ ⁨local⁩ ▸ ⁨lib⁩ ▸ ⁨node_modules⁩ ▸ ⁨app-inspector⁩ ▸ ⁨node_modules⁩ ▸ ⁨xctestwd⁩ and add account through which iOS app has been code signed and submitted; do code-signing on the 2 folders.

Setup for Android

  • Install the latest JDK 1.8 (Java 9 is not supported)
  • Install the Android SDK`
  • Set the ANDROID_HOME environment variable to your ~/.bashrc, ~/.bash_profile, ~/.zshrc or whatever your shell uses.
export ANDROID_HOME = /usr/local/opt/android-sdk

Gradle is needed in order to build UIAutomatorWD and other packages.(For Windows plz download Gradle installer and set a PATH environment variable.) to accept all Android SDK licenses use the command below, and retry the install.

 $ yes | $ANDROID_HOME/tools/bin/sdkmanager --licenses

If you get error like re-install Android driver follow below approach. Navigate to below destination in the terminal and run below command

$ cd /usr/local/lib/node_modules/app-inspector/node_modules/uiautomatorwd/
$ node ./scripts/build.js

Then Run Below Mentioned commands for both Android & iOS for final installations.

$ npm install app-inspector -g

Then to launch Macaca inspector run below mentioned command by connecting your Android or iOS device

$ app-inspector -u YOUR-DEVICE-ID
  • Please ensure the corresponding Android or iOS device ID is passed in place of YOUR-DEVICE-ID

  • Macaca tool will start and your mobile device screen will be loaded in your desktop/laptop browser.

  • Just refresh your browser by opening the corresponding screen on the mobile that you want to inspect.

Note:- For using Macaca for web application refer wiki and scroll down and refer web section installation.

References:-

macacajs.github.io/app-inspector

macacajs.github.io/introduction

macacajs.github.io/environment-setup