JS Methods and Tutorials

This topic describes the properties and methods that can be used in tests, as well as a tutorials for handling browser confirmation dialogs and for working with advanced JS checkpoints.

All HTML DOM element properties and methods can be used with Preflight's JavaScript step type.

Properties and Methods

preflight.element

Access the targeted element's properties and methods.

preflight.error

// get the text content
var text = preflight.element.textContent;

// get the class name
var className = preflight.element.className;

Enables you to throw your own custom exceptions. Ensure you use return.

Note that this will stop the test from proceeding. If you don't want this to happen, set your step as Optional in the Simple tab in the Editor.

return preflight.error("No User ID");

preflight.networkCalls

Enables you to check your network calls:

let networkCall = preflight.networkCalls.find(d =>
d.url.indexOf("endpoint_url") > -1 &&
d.requestMethod == "POST");

if (networkCall.responseCode !== 401){
return preflight.error("Endpoint didn't return 401.");
}

Advanced Variables

Advanced variables allow you to use your variables in any other step after you have created one in a JavaScript step:

var pathName = window.location.pathname;

//create a variable for later steps
preflight.variables.userID = pathName.split("/")[2];

//after you have created it you can use it
//in a later step:
{{js.userID}};

You can only use advanced variables in a single test or workflow.

{{checkpoint(n)}}

Enables you to access grabbed checkpoint values. This is a string type. The first grabbed checkpoint value will be {{checkpoint(1)}}, and the second will be {{checkpoint(2)}} and so on. Ensure your checkpoint is grabbed before moving on.

var checkpoint = {{checkpoint(1)}};

{{common.variableName}}

Enables you to access global variables. This is a string type.

var devPassword = {{common.devPassword}};

console.log()

Enables you to log actions. Your logs will appear in the Console tab in the Editor.

console.log('Hello world of testing!');

Tutorials

How to Handle Browser Confirmation Dialogs

The following is an example of a browser confirmation dialog:

To handle this, create a JavaScript step before the dialog is prompted and type:

console.log('Hello world of testing!');

Advanced JS Checkpoints

It can be difficult to check for values when the value changes per test, for example User IDs. If the User ID is in an element or tag, you can grab that value with checkpoint, however, if there is a prefix preceding the value, for example:

User ID: usr_123456890

It may be difficult to grab the actual User ID. For example, if there is a mistake and the web app did not output the User ID as it was supposed to. If there is a prefix regardless of the output, your element will appear as follows:

User ID:

Instead of:

User ID: usr_123456890

Therefore, since the User ID is constantly changing, you cannot detect the error by normal means. You can prevent this using Javascript:

// We expect 'User ID: ' each time
var expectedText = 'User ID: ';

// Get the text content of the element itself: 
var resultText = preflight.element.textContent;
//  resultText = User ID: usr_123456890

// We replace the expected text with nothing so we can focus
// on the User ID itself
resultText = resultText.replace(expectedText, '');
// resultText = usr_123456890

// Finally, we look at the text that is left to see if it
// contains 'usr_' to see if there is a User ID
if (resultText.indexOf('usr_') === -1 ){
    // If we don't find 'usr_' in the text then we throw an error
    return preflight.error("We didn't see User ID");
}

If your unique text only contains letters, numbers, or both, without a prefix such as usr_, and you are sure that there isn't going to be any other text you can use the example above except for the last part which you should switch out:

...

resultText = resultText.replace(expectedText, '');

// Get rid of whitespaces 
// This guarantees that there are only letters and numbers
resultText = resultText.replace(/\s+/g, '');

// Check the length of the text to see whether you received anything
if (resultText.length <= 0){
    return preflight.error("We didn't see your unique text");
}

Related topics

Using Variables

Using Checkpoints

Step Types