The custom validation we'll demonstrate are:

  • How to validate the value of a number in the recorded app
  • How to validate that two elements have the same text

How to validate a  value of a number in the recorded app?

When you need to validate a number value of an HTML element, sometimes with extra characters - like prices in your page, presented with the currency: $1,000 - you need to convert this string to a number, and then validate it. 

In this example we will:

  • Create a new custom validation step.
  • Capture a label that contains the number in our recorded app, and turn in into a parameter (here's a reminder).
  • Name the HTML  "amountLabel".
  • Write the following JS to validate that it's not over the value of 1000.

JavaScript

// Remove string chars (e.g "$") and turn the price label to a number:
var amount = Number(amountLabel.innerText.replace(/[^\-0-9\.]+/g,""));

// Validate if the number is bigger than 1000:
if(amount > 1000) {
  throw new Error('Amount should not be over 1000! Actual value:' + amount);
} else {
  return true;
}

Compare two text elements on screen

When you need to compare two elements on the screen, and want to make sure they have the same text - here is how to do it:
We will add a first HTML parameter named "first_label", and a second HTML parameter named "second_label" (see how to add parameters), and validate that the text in first_label equals to the text in second_label:

JavaScript

var equal = firstLabel.innerText === secondLabel.innerText;

if(!equal) {
  throw new Error('Labels are not equal. First label: ' + firstLabel.innerText +
                  'Second label: ' + secondLabel.innerText);
}

return equal;

If you'll add another item to the cart you'll see that the two texts are different and the step will fail:

Notice the informative error message we return when the labels are not equal:

Want more guides? Tell us about it!

Did this answer your question?