Touch Event

Please read the Terms of Use for Materials on ZennoLab

1 Table of contents
2 Description
3 How to add an action to a project?
4 Where can it be applied?
5 How to work with an action?
6 Select an event
7 Element search
8 Coordinates
- 8.1 Search for element by Coordinates.
9 Usage example
- 9.1 Examples of work in C#
  - 9.1.1 Emulation of touch-pressing
  - 9.1.2 Scrolling
  - 9.1.3 Swipe right
  - 9.1.4 Settings
10 Useful links

Description

This action allows you to emulate a Touch event (finger clicks).

How to add an action to a project?

Through the context menu Add Action → Tabs → Touch Event

Or use smart search .

Where can it be applied?

In cases where you need to emulate a phone or any other touchscreen device
In cases when you need to bring all actions as close as possible to human ones.

How to work with an action?

It is necessary to enable “Record” and “Touch” input mode in the browser window so that all actions executed in the browser are automatically recorded as Touch events.

Select an event

Touch - pressing (click / touch);
Long Touch - long clamping (right click)

Element search

Coordinates

Search for element by Coordinates.

Execute a Touch event within the specified coordinates.

Which tab is Active /First / By name / By number
Coordinates - you need to enter a range of X and Y coordinates. You can use project variables - {-Variable.example_var-} .

Usage example

Take as an example our resource where you can practice making simple clicks - https://lessons.zennolab.com/en/index . For implementation, we will use the Action Designer .

Go to the page in ProjectMaker'e.

We go down to the bottom and find the field for pressing and selecting the OS. Click on the place for the "checkmark" with the right mouse button and select "In the constructor of actions.

We select the action Rise , Event touch . Click on the Test button to check.

If the click was successful, then click Add to project

Examples of work in C#

Starting with version 7.1.4.0, a Touch property with a set of methods has been added to the CommandCenter.Tab. The Touch property contains basic methods: TouchStart, TouchEnd, TouchMove, TouchCancel, as well as complex methods with Touch overloads, SwipeIntoView, SwipeBetween and others.

Emulation of touch-pressing

var tab = instance.ActiveTab;
var init = tab.FindElementByXPath("/html/body/button", 0); // Searching for an HTML element via XPath
tab.Touch.Touch(init); // Click on it

Scrolling

var tab = instance.ActiveTab;
HtmlElement init = tab.FindElementByXPath(".//button", 0); // Searching for an HTML element via XPath
tab.Touch.SwipeIntoView(init); // Scroll the screen with touchscreens to the desired HTML element

Swipe right

var tab = instance.ActiveTab;

// We will swipe inside the HTML element. Let's compose an XPath expression.
var canvas = tab.FindElementByXPath(@"//*[@id=""canvas""]", 0);

// We get its dimensions: width and height
var width = canvas.BoundingClientWidth;
var height = canvas.BoundingClientHeight;

// Determine the coordinates of the first touch along the X axis, and the last when you release your finger
var offsetX = width / 4;
var minX = canvas.DisplacementInBrowser.X + offsetX;
var maxX = minX + width - 2*offsetX;

// Determine the coordinates of the first touch along the Y axis, and the last when you release your finger
var offsetY = height / 4;
var minY = canvas.DisplacementInBrowser.Y + offsetY;
var maxY = minY;

// Swipe to the right
tab.Touch.SwipeBetween(minX, minY, maxX, maxY);

Settings

Only part of the settings is displayed here. You can find a complete list in the documentation.

By default, a number of parameters are taken into account and randomized: speed, acceleration, motion curve, and others. All movements will be as natural as possible out of the box, but if you need to make adjustments to the behavior of touch events, there is such a possibility too.

Demonstration project