Gestures in Appium - Part 11 - Use Appium Inspector to Create Gestures :: Mohammad's Blog

Overview

This is the eleventh part (last one) of the complete Gestures guide in the Appium series.

Did you know that there’s a very interesting feature in the Appium Inspector designed to create gestures for us? It’s like drawing gestures on your app screen!

What is Appium Inspector?

I’m pretty sure that the reader is familiar with this tool since it’s used to locate elements, and we use it from day one in mobile automation. However, for those who don’t know, it’s a desktop application (available on Windows, Mac, and Linux) used to locate elements of the application and write locators.

Link to the project: https://github.com/appium/appium-inspector

Documentation: https://appium.github.io/appium-inspector/latest/

You can familiarize yourself with this app in its GitHub repo and official documentation, especially the Gestures tab which we are going to use here.

In this demo, we’re going to perform a Zoom In (Pinch) on Google Maps, similar to what we did in Part 8 .

Creating Pointers

In Appium Inspector, you can create as many pointers as you want to represent the fingers. We need two fingers to perform a Zoom, one moving to the left and one to the right.

Adding Actions

As mentioned in Part 8 , we should perform a drag for each finger in the opposite direction (Move > Pointer Down > Move > Pointer Up).

For each action, we add an action card and then we set the Action Type. Next, we should choose the points on the map. It can be a percentage of the screen bonding area (%) or simply coordinates in pixels (px). You can see there is a button on the app to switch between these units. You can also type them manually (when you move the mouse, on the left top of the screen, the current hover coordinates are shown). Additionally, we can set Duration in milliseconds and left/right button if applicable, which you can see in the action card.

Appium Gestures Builder - Adding Actions

Now let’s finish the actions for our left finger.

The same for the second finger (right):

At the end, you’ll see a timeline for each finger, which shows the steps of the gestures. Pay attention to the arrow direction (up for Pointer Up, down for Pointer Down, and right for Move). Additionally, by hovering the mouse over each step, you will see the details related to that step.

To fine-tune the gesture, you may manually change the values of the coordinates. We can set all y coordinates equal to each other (as explained in Part 8 ) and make the drag distance of each finger equal but in opposite directions. For example, +400px and -400px.

In my case, I changed them to the following: