[KShare] How to capture overlapped mobile elements, especially in Hybrid Apps

[support.squad]

Hi all,

For February, we at the Product Support team are going to switch gear and focus on mobile testing, so you can expect lots of useful tips and tricks in the coming weeks.

Have you ever been consistently capturing the wrong elements despite a basic element like the Tìm kiếm (“Search”) button below?

If so, you may be using a mobile hybrid app, and the elements are covered in layers.

How to recognize a hybrid app?

You can either:

• If your team is developing the app, you can consult with your team members about it, or

• Check the Object Tree of Katalon Studio for the Webview information, or

• Check the kinds of framework that your applications are built on top of:
  • React Native
  • Flutter
  • Ionic
  • Xamarin
  • Apache Cordova/PhoneGap

How to perform Record/Spy overlapped elements?

From Katalon Studio version 9.0.0 onward, you can detect the overlapped elements through the indexes. Also, switching the focused elements by using the Command key on macOS or the Ctrl key on Windows.

For example, in the attached screenshot below, the element in red is focused on…

Moreover, you can see the information below…

(2/2) android.view.view

More advanced supported features

From Katalon Studio 9.0.0 onward, you can get the dimensions of elements directly on the Mobile Recorder. With that information, you can easily apply the value to the keywords like Mobile.swipe(), Mobile.tapAndHoldAtPosition(x,y), or Mobile.tapAtPosition(x,y)

In the attached screenshot, you can see the information on the element’s dimensions below

(1215, 693) / (0, 448) 1440x1944

… in which:

• (1215, 693) → the dimensions of the cursor.

• (0, 448) → the dimensions of element’s position counted from the top left corner of the screen.

• 1440x1944 → The size of the element.

Now, let’s see how to apply that piece of information to the Katalon Keywords,

Mobile.swipe(start x, start y, end x, end y)

Move the cursor to the start point, you can get the values of the start x and start y from the dimensions of the cursor. For example…

• start x = 1215
• start y = 693

We can do the same steps for the finish point.

Also, we can use the cursor dimensions for the keywords like Mobile.tapAndHoldAtPosition(x,y) and Mobile.tapAtPosition(x,y)

We hope that Katalon Studio version 9.x will help you get through the majority of the challenging situations for which you have been searching for answers.

Give it a try and share with us your cases below!

---

If you find this article helpful, then don’t forget to leave a thumb up or a big heart !

To see other articles from KShare, simply navigate to the support tag or go to our #product-insights area.

[albert.vu]

Thank you very much the Product Support team (@support.squad) for yet another informative article! And Kudos to our contributors below

Linh Nguyen (@linh.nguyen) - Product Support Manager at Katalon	Thong Tran (@thong.tran) - Senior Software Engineer at Katalon
Linh is the Product Support team Manager at Katalon. She spent many years working as an Automation Testing QA before joining Katalon Product Support as a technical support expert. Based on her experiences, she usually provides consumers with highly applicable solutions. She now manages her team with a user-centric approach to guarantee customers greater success with Katalon Products.	A passionate Katalon developer with a wealth of programming and testing expertise. Thong has been dedicated to providing exceptional enterprise support for the past five years, helping Katalon’s customers achieve their testing goals with ease.

[albert.vu]

Do you have an idea for a topic that you would like the Product Supoprt team to cover in their next KShare article? Then share them with us by simply fill in the form below

[KShare] Your feedback matters!