Table of contents
Expand | ||||
---|---|---|---|---|
| ||||
|
Description
This action is used when you need to somehow interact with the site (except when entering text when using the Set value action).
What can be emulated:
...
Via the context menu Add Action → Tabs → Rise Event
...
Through the actionAction designer.
Or use smart search .
How to select an element to execute an event?
...
When the mouse cursor is over one of the smileys, it changes color (this also applies to the background, eyes and mouth of the smiley). Right-click on any of the emoticons and send it to the action designer (1) .
...
The search parameters for the element were substituted automatically, we will not focus on them now. What you should pay attention to:
in the Select action item (2) , select Rise (the default is Set - Setting the value )
select the desired Event (3) , in our case - onmouseover
be sure to click the Test button (4) to make sure that everything is configured correctly (specifically, in our case, the central, yellow, smiley should change color)
(optional) add comment (6) . Automatic comment is not very informative, and when there are many actions in your template, it will be very difficult to understand what this or that action is doing.
if everything is configured and works as intended, then add the action to the project (5)
...
most often you will use this action to click on buttons, menu items ( switches ), checkboxes
drag and drop site elements
emulate mouse hover events to get a tooltip
calling JavaScript events for input fields.
sometimes website builders put additional JavaScript scripts on the input fields (for example, checking that the correct data has been entered in the field) and it is impossible to continue working without these scripts running. In such cases, you can try to call events onchange, onkeypress , etc. (if calling these events does not help, then you can use keyboard emulation and mouse emulation )
How to work with an action?
...
In this field, you can manually specify a value, and not choose from the proposed.
You can also use project variables here ( {-Variable.var_name-}
)
...
You can practice in simple clicks on the page https://lessons.zennolab.com/ruen/index (switches, checkboxes) or here https://lessons.zennolab.com/en/registration (button at the bottom of the form).
...
But in this case it is not necessary to bother with the selection and emulation of events, you can look at the source code of the page and notice that the tooltip text is stored in the data-tooltip
attribute and its value can be easily obtained using the Take Get value action. Very often the code of such hints is stored in the code of the page itself, and if you look carefully, you can find it.
...
Example No. 2
But sometimes everything is a little more complicated - when you hover the mouse cursor, using a JavaScript script, a request is sent to the server, a response is expected and, using the same JavaScript, the response is embedded in the body of the page. An example is the Zennolab forum. When you hover over the topic name, after a short time, a small window appears with content from the topic
...
you can use the Execute event action to emulate onmouseover to wait for the window to appear. Then, using the Take Get value cube, parse innerHtml and only then, using Text Processing, we get the values we need.
or you can try to repeat the request that is sent to the server. To do this, you can use both external and internal tools: either the web developer tools (available only for the Chrome browser), or the Traffic window
Expand | ||
---|---|---|
| ||
The same request in the instruments and in the traffic window is highlighted in blue. |
...
Right-click on the element that needs to be dragged, send it to the Action Designer .
Action - Rise, event - drag.
set X and Y - these are the coordinates of the beginning of the movement. Coordinates are measured from the upper left corner of the selected element (at this corner, point X = 1 and point Y = 1). Here the template will make the first click - drag .
Now we make a right-click on the element WHERE to drag, also send it to the Action Designer.
Action - Rise, event - drop.
set X and Y - these are the coordinates of the end of the movement. Coordinates are measured from the upper left corner of the selected element (at this corner, point X = 1 and point Y = 1). The template will drop the first element to this point of the second element.
...