Appium Server and Appium Inspector

Mobile element inspection

1. Requirements

• Java and Android Studio
• Node.JS and NPM

2. Install Appium V2

npm i -g appium
appium -v
2.5.1

Note: As appium is officially version 2, we do not need anymore to use appium@next

3. Install an Appium Driver:

List available drivers for appium:

 appium driver list

✔ Listing available drivers
- uiautomator2 [not installed]
- xcuitest [not installed]
- mac2 [not installed]
- espresso [not installed]
- safari [not installed]
- gecko [not installed]
- chromium [not installed]

• uiautomator2 — for Android
• xcuitest — for iOS
• safari — for Safari Browser
• gecko — for Firefox Browser
• chromium — for Chrome Browser

appium driver install uiautomator2

✔ Installing 'uiautomator2' using NPM install spec 'appium-uiautomator2-driver'
ℹ Driver uiautomator2@2.29.2 successfully installed
- automationName: UiAutomator2
- platformNames: ["Android"]

List available plugins for appium:

appium plugin list

✔ Listing available plugins
- images [not installed]
- execute-driver [not installed]
- relaxed-caps [not installed]
- universal-xml [not installed]

appium plugin install images

Note: .appium is the default home directory, but it can be edited declaring the variable APPIUM_HOME:

APPIUM_HOME=/path/to/home appium driver install

4. Start Appium Server

appium server -p 4723 -a localhost -pa /

• -p — for port number — default 4723 (but prefer localhost)
• -a — for remote host ip — default 127.0.0.1
• -pa — for remote path — default /

Note: If you don't declare the server parameter it will initialize with the default values: host 127.0.0.1, port 4723 and path / but it is not encouraged to do so:

appium 
OR
appium server

5. Open Emulator or plugin device

Note: Due to a current emulator issue, emulator cant launch avds, to workaround it until it`s not fixed, create a alias to the emulator at ~/.bashrc

alias emu="$ANDROID_HOME/tools/emulator"

So, use 'emu' instead of 'emulator':

emulator -avd <android emulator name>
OR
emulator @<android emulator name>

emulator -avd Pixel_3a_API_34_extension_level_7_x86_64
OR
emulator @Pixel_3a_API_34_extension_level_7_x86_64

emu -avd <android emulator name>
OR
emu @<android emulator name>

emu -avd Pixel_3a_API_34_extension_level_7_x86_64
OR
emu @Pixel_3a_API_34_extension_level_7_x86_64

Connect your Android phone at USB or open an Android Emulator, and enable the Debug Mode:

Settings > System > About > Click 7 times into Build Number to enable Developer Mode

Turn ON the USB Debugging:

Settings > About Device > Click at Android Build Number > Developer Options > USB Debugging > Turn ON Debug Mode
OR
Settings > System > Developer Options > USB Debugging > Turn ON Debug Mode

And verify if the device or emulator is visible to the system (this is also the udid device value of your device):

adb devices

emulator-5554 device

It`s possible to install your .apk into device/emulator or drag-in-drop into emulator

adb install path/to/file.apk

6. Setup Capabilities into Inspector

Download the Appium Inspector: https://github.com/appium/appium-inspector/releases, and open it:

chmod +x Appium-Inspector-linux-2024.6.1.AppImage
./Appium-Inspector-linux-2024.6.1.AppImage

Setup the current appium server information:

• Remote Host: localhost (127.0.0.1 default)
• Remote Port: 4723 (default)
• Remote Path: / (default)

Fill the Desired capabilities to identify the device or emulator:

• deviceName or udid or avd — to identify the device (One at least)
• platformName -to identify the device platform
• platformVersion -to identify the device platform version (Optional)
• app — to install the application .apk (Optional)
• appPackage and appActivity — to identify the installed app and activity
• automationName — to identify the driver (UIAutomator2, xcuitest, … )
• noReset — to restricts the running application from clearing or stopping the application data (Optional)
• isHeadless — to enable or disable headless (Optional)
• newCommandTimeout — time to execute next command (Optional)

To find out the app package and activity, open the application into emulator or devices to be in focus, and run those lines:

adb shell dumpsys window windows | grep -i <app name>
OR
adb shell dumpsys window windows | findstr <app name>

adb shell dumpsys window windows | grep -i wikipedia
  Window #8 Window{736a971 u0 org.wikipedia/org.wikipedia.onboarding.InitialOnboardingActivity}:

At first line (Window #n): <package>.<activity> = <org.wikipedia.onboarding>.<InitialOnboardingActivity>

On Board Screen — InitialOnboardingActivity

This is the intro screen, a guide or tutorial screen that only appears one single time, but we want to check element for the Main screen, so skip the introduction screen and move to the main screen and run the command again:

adb shell dumpsys window windows | grep -i <app name>
OR
adb shell dumpsys window windows | findstr <app name>

adb shell dumpsys window windows | grep -i wikipedia
  Window #9 Window{3d3bd0b u0 org.wikipedia/org.wikipedia.main.MainActivity}:

At first line (Window #n): <package>/<activity> = <org.wikipedia>/<org.wikipedia.main.MainActivity>

Main Screen MainActivity

Notes:

• At appim inspector, for appium v2, it is needed to use the prefix appium: before each capabilites — but for appium V1, remove the appium:options and appium: prefix
• You need just one of above information: avd or deviceName or udid, but not all. If you have duplicated avd or deviceName listed, the first one listed will be selected, and udid is an unique identifier.
• For app capabilities, for appium v2 it`s not supported relative paths — and for appium v1, you must use absolute paths

Save the JSON capabilities for later, with Save As option:

{
  "appium:browserName": null,
  "appium:platformName": "android",
  "appium:automationName": "UiAutomator2",
  "appium:avd": "nightwatch-android-11",
  "appium:app": "/home/popos/Projetos/nightwatch-appium-android/nightwatch/sample-apps/wikipedia.apk",
  "appium:appPackage": "org.wikipedia",
  "appium:appActivity": "org.wikipedia.main.MainActivity",
  "appium:appWaitActivity": "org.wikipedia.onboarding.InitialOnboardingActivity",
  "appium:chromedriverExecutable": "/home/popos/Projetos/nightwatch-appium-android/chromedriver-mobile/chromedriver",
  "appium:newCommandTimeout": 0
}

Press Start Session

Appium Inspector — Connect to Appium Server — Capabilities

Appium Inspector will find and connect to the Appium Server, install the .apk application package, open it, and displays the selected activity screen.

Appium Inspector — Connected to Appium Server — Select Element

• at left, we have the device screen
• at middle the source
• at right the selected element
• at the top some tools like back, home and switch buttons, a refresh button, search element and recording, and the X button to end the session

8. Identify elements with Appium Inspector

Click into any element to interact with, and takes notes from id or xpath

• id: com.atomczak.notepat:id/new_note_fab
• xpath: //android.widget.ImageButton[@content-desc=”New note”]

9. Test case (brief example)

• An example of test case: Access the wikipedia application, select the skip option, search for BrowserStack, and assert the title BrowserStack

describe('Wikipedia Android app test', function() {
  before(function(app) {
    app.click('id', 'org.wikipedia:id/fragment_onboarding_skip_button');
  });

  it('Search for BrowserStack', async function(app) {
    app
      .click('id', 'org.wikipedia:id/search_container')
      .sendKeys('id', 'org.wikipedia:id/search_src_text', 'browserstack')
      .click({selector: 'org.wikipedia:id/page_list_item_title', locateStrategy: 'id', index: 0})
      .waitUntil(async function() {
        // wait for webview context to be available
        const contexts = await this.appium.getContexts();
        return contexts.includes('WEBVIEW_org.wikipedia');
      })
      .appium.setContext('WEBVIEW_org.wikipedia')
      .assert.textEquals('.pcs-edit-section-title', 'BrowserStack');  // command run in webview context
  });
});

Note: test case using Nightwatch, JavaScript and Appium!

8. Run the test suite — next chapters…

Run test case depends from which language and framework were selected to perform the test cases.

To know how to prepar and run test case with Appium check it out our next post: https://medium.com/@dmaioni/nightwatchjs-9a526ea984ad

See you later!

Appium logo