Categories

Javascript code calling

Use Javascript code in Agilitest

Load a function with Javascript

All available Javascript functions can be loaded into a scripting action.

execute code in javascript

And return the value of the selected function by checking the “return value” box.

Some functions require one or more parameters.

Example :

HTML functions

The “AppendChild” function demands 1 parameter.

Click actions

It is possible to execute Javascript code for mouse-click actions.

To activate the option, click on the checkbox allowing Javascript code to be used.

🔸 Warning

A special feature applies to elements in an iFrame.

The option to use Javascript code is automatically selected as soon as the element is in an iframe and the iframe is selected as an attribute.

This option can be disabled directly from the mouse action.

Add a condition in an action

To add a condition to an action, right click on the action.

Select “execute condition

This will take the first variable of the script to define the code as a result when evaluating the function.

To verify that the condition is “true”:

true == true

To verify that a value a is greater or lower than another value:

$var(…) > 10

To verify the string caracters you will need to add a single quote:

‘$var(…)’ == ‘14’

This enables Javascript to differentiate between numerical values and character strings.

The condition will only be executed if the javascript code returns “true”, otherwise it will not be executed.

Practice case of a Javascript callscript

Agilitest allows you to call javascript code on a component that has been captured.

This differs from a java call which is more akin to a sub-script call.

In both cases, it is possible to modify the elements of the software you are testing, and thus detach yourself from the operation you're supposed to be controlling.

In some cases, this is very practical, if not necessary:

Example:

Let's take a look at the cursor.

The following image shows two cursors of different sizes, each with an initial value of 50.

example with 2 cursors

When manipulating a cursor, it's quite complex to define a precise value using only mouse movement actions.

For example, if we indicate a 100-pixel slide to the right on both cursors, we'll be able to move the cursor to the right.

drag and swipe actions

These will not display the same value, as they do not have the same configuration. (Value 67 for the large and 84 for the small).

2 cursors with a different value
  • What's the problem?

If you run a test based on a 100 pixel displacement, and then the cursor value becomes critical to the success of your test, you become dependent on the cursor implementation.

In this case, Javascript is particularly suitable, as it allows you to set a value directly on the cursor element by modifying the value of its internal variable.

Example :

If you define a 90 value on both cursors,

java action

Both cursors will display the same value despite their different size and movement.

2 cursors with the same value

Visuals control

You can modify the style and therefore the color of the elements you're testing.

To do this, simply modify the style object :

style.backgroundColor="green

java action

This will enable you to display visual checks in ATSV files or XML reports produced by Agilitest.

a cursor in green

A complex control integrated into the page

In some cases where you need to perform a complex check on your page, it is quite possible to code this check in javascript code loaded into the page, then call the javascript function in your test, retrieving the value returned to perform a simple check.

This is not an optimal situation, as you may have to manage development code including this function and production code with the hazards it may cause, but it can lead to complex situations to manage.

To do this, simply declare a global function in a SCRIPT tag on your page:

<SCRIPT>function checkpage() { ....operations... if (condition) { return true; } else { return false; }}</SCRIPT>

Then simply call it from your Agilitest editor, referencing a return variable, on which you will just have to perform a value check.

return variable

Still require support?
Contact support