Testim Copilot is here | Learn More

Numeric Validation with Testim

When validating textual data on a page, sometimes it is desirable to validate the text numerically instead of textually.  This…

Author Avatar
By Barry Solomon,

When validating textual data on a page, sometimes it is desirable to validate the text numerically instead of textually.  This can include calculations as well as checking that a value is positive, negative, non-zero, or greater than some expected value.

In this blog, I’m going to show you how to do a numeric validation in Testim. This blog is going to get a bit more technical, but I’ll give you some options and example scripts that you can try. If you are interested in the “why”, you can even learn the logic behind the code.

Testim’s text validation step allows us to do calculations on the expected value, but what about when a calculation or comparison needs to be done on the actual value?

As we know, the expected value property of the text validation step is evaluated and can contain expressions like a simple tax calculation.

But what about when we want to check that a value is greater than 0?  You might be tempted to try something such as:

But are summarily greeted by:

Oh, if only it were that easy!

Two potential solutions I will outline here.  

The first is to use regular expressions in a standard text validation step.  For simple comparisons [ <0 , = 0, >0 and >=0] this is a reasonable approach, though some users will freak even at the mention of RegEx, so….

     For a number greater than 0 

     

     For a number greater than or equal to 0 

     

     Less Than 0

     

This works but can be challenging a tester who is not versed in regular expressions and frankly, regular expressions are a pain to read.  

What happens if there is an alpha character with the actual value such as a $ when dealing with currency?  This will fail because the actual value will not be a number that can be compared.

In addition, it gets a tad more complicated rather quickly.  If we wanted to validate that a number is greater than another number, that will be neigh impossible to manage and if you do, it will not be pretty.

For example, say we want to validate a number is greater than 654.  The regular expression to accomplish this would be:

     /65[5-9]|6[6-9]\d|[1-9]\d{3,}/

This is a 3 part regular expression ( parts are separated by a pipe | )

     65[5-9]   matches numbers from 655-659

     6[6-9]\d    matches numbers from 660-999

     [1-9]\d{3,}  matches numbers > 1000

As we can see, functional, but not very readable.  And impossible to use if a variable value is desired to be the target threshold.

A better way to accomplish this is to use a custom JavaScript step with parameters 

Create Custom Step to Validate Numeric Expressions

First, create a new Custom Action shared step and name it “Validate Numeric” 

Define 3 parameters.

element (HTML):  element with the value to be checked

expression (JS):    numeric comparator string.  (The double-quotes being the giveaway here)

ex:  “>”, “>=”, “==”, “<“, “<=”

expectedValue (JS):  numeric value to be compared against

Copy/Paste the following JavaScript snippet into the function body, save the test and “Bob’s your uncle”.

var actualValue = Number(element.innerText.replace(/\D/g,''));
try {
    var result = eval("(" + actualValue + expression.toString() + expectedValue + ")");
    if (result === true)
        return true;
    else 
        throw new Error ("Validation (" + actualValue + expression.toString() + expectedValue + ")  failed");
}
catch (error) {
    throw new Error (error.message);
}

You now have a shared step that will allow you to validate the equality and inequalities of numeric data.

Detailed Explanation 

If functionality is all you want, then we are done here.  If you want to understand the code, then read on intrepid explorer.  

First, we extract the textual value from the element 

element.innerText

Next, remove all non-numeric characters using the JavaScript replace method with a regular expression /\D/g 

element.innerText.replace(/\D/g,'')

The stripped string is then converted to a number.  

Number( element.innerText.replace(/\D/g,'') );

And assigned to the variable actualValue

var actualValue = parseInt( element.innerText.replace(/\D/g,'') );

Next, we build out the expression as a string

actualValue + expression.toString() + expectedValue

Execute the expression using the JavaScript eval() function and store the result in a variable called result.

var result = eval("(" + actualValue + expression.toString() + expectedValue + ")");

Note that in order for the eval() command to return the value of the expression, the expression must be enclosed with parenthesis “( )”

Then we branch on the truthiness of the result

If the expression evaluates to true then return true, else throw an error.  We throw an Error, to log information as to what failed instead of just a generic step failed.

if (result === true)y
    return true;
  else 
    throw new Error ("Validation (" + actualValue + expression.toString() + expectedValue + ") failed");

Finally wrap everything in a try/catch because as we know, users will enter in crazy data and we want an elegant fail that can show what went wrong with the parameters entered by our users of this step.

try {
    var result = eval("(" + actualValue + expression.toString() + expectedValue + ")");
    if (result === true)
        return true;
    else 
        throw new Error ("Validation (" + actualValue + expression.toString() + expectedValue + ")                    failed");
}
catch (error) {
      throw new Error (error.message);
}

 

Finally, I usually like to override the default timeout to something like 5000, so not to have to wait for 30 seconds for the test to fail because I left out some stupid trailing “)” or some such nonsense.

Hopefully, you now understand how to perform a numeric validation with Testim. While it might seem a little complicated for the non-technical type, you can create this once as a shared step and then share it across multiple tests.

Enjoy!