There are multiple ways to find an element for native and hybrid apps, such as UIAutomatorviewer (for Android only) and Appium Inspector (for both Android and iOS). Let's start with the uiautomator.
We can find the UIAutomatorviewer in the Android SDK folder C:android-sdk ools (assuming that the SDK located in the C drive); you can find the same in Mac as well under the tools folder, as shown in the following screenshot:
To open uiautomatorviewer, you need to double-click on it. You will get the following screen:
Now, we are going to take an example of finding an element of the Android app calculator. We need to perform the following steps:
- Open the Android emulator or real device (For a real device, we need to enable USB debugging).
- Open the calculator app.
-
Now, click on the device's screenshot icon
from the UI Automator Viewer window (The progress information box will be visible.). If more than one device is running, then UIAutomatorviewer will ask you to select the device to capture the screenshot. The following is the screenshot of the calculator.
You will get the screenshot of the calculator successfully.
Now, it's time to find an element with different locators supported by the Appium driver.
The method signature will be the same as the one we saw earlier to find an element by ID for web apps:
findElement(By.id(String id));
We need to pass the ID of the element we want to interact with. Here, we are going to find the digit 5 from the calculator app using UI Automator Viewer. We need to perform the following steps:
- Click on the digit 5 from UI Automator Viewer.
- Under Node Details, you will get resource-id as com.android.calculator2:id/digit5:
- We can use resource-id as an ID to perform an action on the digit 5. This is how the command will look:
WebElement digit_5=driver.findElement(By.id("com.android.calculator2:id/digit5")); - To click on the digit 5, we can use the following command:
digit_5.click();
The method signature will be the same as the one we saw earlier to find an element by name for web apps:
findElement(By.name(String Name));
We need to pass the name of the element we want to interact with. Here, we are going to find the DELETE button from the calculator app using UI Automator Viewer. We need to perform the following steps:
- Click on DELETE from UI Automator Viewer.
- Under Node Details, you will get the text as DELETE, as shown here:
We can use the DELETE text to locate the DELETE button as Name. This is how the command will look:
WebElement delete=driver.findElement(By.name("DELETE")); - To click on the DELETE button, we can use the following command:
delete.click();
We can find an element using the className locator as well. This is how the method signature looks:
findElement(By.className(String ClassName));
We need to pass the className of the element we want to interact with. Here, we are going to find the EditBox from the calculator app using UI Automator Viewer. We need to perform the following steps:
- Click on EditBox from UI Automator Viewer.
- Under Node Detail, you will get the class as
android.widget.EditText:
- We can use
classasclassNameto perform an action on EditBox. This is how the command will look:WebElement editBox=driver.findElement(By.className("android.widget.EditText")); - To get the value from the EditBox, we can use the following command:
editBox.getText();
If the same class is used for multiple elements, then we need to select an element on the basis of indexing. For example, if we want to select the digit 7 on the basis of className, then this is how the code will look:
List<WebElement> editBox=driver.findElements(By.className("android.widget.Button"));
editBox.get(1).click();We are using findElements in place of findElement in the preceding code; the preceding code will return more than one value. Here, the digit 7 has an index value 1, so we have to pass an index value of 1 to take an action.
The Appium developers wanted to give us more options to locate an element, so they created AccessibilityId. It locates the element, same as ID and name. This is how the method signature for AccessibilityId looks:
findElement(By.AccessibilityId(String AccId));
We need to pass an AccId of the element we want to interact with. Here, we are going to find the + sign from the calculator app using UI Automator Viewer. We need to perform the following steps:
- Click on the + sign from UI Automator Viewer.
- Under Node Details, you will get the content-desc as plus:
- We can use content-desc as
AccIdto perform an action on the + sign. This is how the command will look:WebElement plusSign=driver. findElementByAccessibilityId("plus"); - To click on the + sign, we can use the following command:
plusSign.click();
AndroidUIAutomator is a very powerful locator to find an element. It uses the Android UIAutomator library to find an element. The method signature looks like this:
findElement(By.AndroidUIAutomator(String UIAuto));
We need to pass the UIAuto of an element that we want to interact with. Here, we are going to find the = sign from the calculator app using UI Automator Viewer. We need to perform the following steps:
- Click on the = sign from UI Automator Viewer.
- Under the Node details, we can pick any of the values. For example,
resource-idascom.android.calculator2:id/equal. We can useresource-idasUIAutoto perform an action on the = sign. This is how the command will look:WebElement equal=driver. findElementByAndroidUIAutomator("new UiSelector().resourceId("com.android.calculator2:id/equal")"; - To click on the = sign, we can use the following command:
equal.click();
- Another example is to pick
content-descasequals, so the command will look like this:WebElement equal=driver. findElementBy.AndroidUIAutomator("new UiSelector().description("equals")");
Note
If you want to find out more about the UIAutomator library, then it might be helpful to check out http://developer.android.com/tools/testing/testing_ui.html and http://developer.android.com/tools/help/uiautomator/UiSelector.html.
We learned in an earlier chapter that Appium Inspector works well on the Mac platform. So, we will now use it on Mac to find elements.
To start the Appium Inspector for Android, we need to perform the following steps:
- We need to specify the path of the application, package, and activity name in the Appium GUI in case of an emulator. In the case of a real device, the package and activity name is sufficient.
Note
From where can you find out about the package and activity name of the app if the app is running on a physical device?
You can install the APK Info app from the Play Store (https://play.google.com/store/apps/details?id=de.migali.soft.apkinfo&hl=en) to know about the package and activity name of the app. If you have an app on your desktop, then the Appium server will automatically retrieve the package and activity name once the app's path is specified.
- The Prelaunch Application option should be checked under General Settings.
- If you are working with an emulator, then it should be open or the Launch AVD option should be checked under Android Settings (assuming that you have created the emulator). On the other hand, if you are working with a real device, then the device should be connected and the USB debugging option should be checked.
- Click on the Launch button.
- Click on the Inspector icon. Now, Appium Inspector will be launched, as shown in the following screenshot. Again, let's take the example of the calculator app.
We have already seen a lot of ways to find an element in UI Automator Viewer; now we are going to find an element with Xpath.
Xpath is bit slower than the ID and name methods, but it is a very useful approach to find an element. The method signature will look like this:
findElement(By.xpath(String XPath));
We need to pass the Xpath of the element we want to look for. It will return a WebElement object that we can perform actions on.
We are going to use the Xpath of the digit 9; this is how the command will look:
WebElement digit_9=driver.findElement(By.xpath("//android.widget.LinearLayout[1]/ android.widget.FrameLayout[1]/ android.widget.LinearLayout[1]/ android.support.v4.view.viewPager[1]/ android.widget.LinearLayout[1]/ android.widget.LinearLayout[1]/ android.widget.Button[3]"));
You can use the WebElement reference, digit_9, to perform an action on the digit 9, which has been shown in the preceding screenshot.
We learned how to find an element on Android devices. Now, it is the turn to iOS. To start the Appium Inspector for iOS, we need to perform the following steps:
- We need to specify the path of the application in the Appium GUI.
- The Prelaunch Application option should be checked under General Settings.
- If you are working with a simulator, then it should be open or the Force Device option should be checked under iOS Settings and then you have to choose the desired iOS simulator. On the other hand, if you are working with a real device, then the device should be connected and the device UDID should be specified.
- Click on the Launch button.
- Click on the Inspector icon.
Here, we are going to take an example of TestApp, which you can download from the Appium GitHub repository (https://github.com/appium/appium/blob/master/assets/TestApp7.1.app.zip?raw=true). Thanks to Appium developers for creating TestApp.
The method signature will be the same as we the one we saw earlier to find an element by name for web apps:
findElement(By.name(String Name));
We need to pass the name of the element we want to interact with. Here, we are going to find the second EditBox from the TestApp using the Appium Inspector. We need to perform the following steps:
- Click on the second EditBox from the Appium Inspector.
- Under the Details tab you will get the name as IntegerB. We can use name as Name to identify the 2nd EditBox. The command will look like this:
WebElement editBox=driver.findElement(By.name("IntegerB")); - To type in the EditBox, we can use the following command:
editBox.sendKeys("12");
UIAutomation is a JavaScript library that is used to find an element in Apple's Automation Instruments. Appium developers have given us a similar way to find an element in Appium using IosUIAutomation. This is how the method signature looks:
findElements(By.IosUIAutomation(String IosUIAuto));
We need to perform the following steps if we want to use the IosUIAutomation:
- We need to pass the
IosUIAutovalue of an element we want to interact with. Here, we are going to find the first EditBox from the TestApp using Apple's UIAutomation library.For example, to find an element on the basis of the UIAutomation library using
elementsfunction, it will return an elements array. We can find the element using an index.The command will look like this:
WebElement editBox=driver. findElements(By.IosUIAutomation(".elements()[0]")); //Here '0' is an element index - To type in the first EditBox, we can use the following command:
editBox.sendKeys("10"); - Another example is to find the element on the basis of the
textFieldsobject, where the command will look like this:WebElement editBox=driver. findElements(By.IosUIAutomation(".textFields()[0]"));
Note
If you want to explore the UIAutomation library more, then it might be helpful to visit https://developer.apple.com/library/ios/documentation/ToolsLanguages/Reference/UIAElementClassReference/index.html#//apple_ref/doc/uid/TP40009903-CH1-SW6.