Add network validation

The network validation step allows you to validate your network requests. It is a predefined validation step that receives and array (networkRequests) of objects (see table below). This step enables you to run JavaScript code on the networkRequests array.

📘

The network validation step is only available when using the Chrome browser.

Network Validation

The following objects (in the networkRequests array) are available to validate:

To add an Add network validation step:

1. Hover over the (arrow symbol) where you want to add the step.

The action options are displayed.

2. Click on the “M” (Testim predefined steps).
   The Predefined steps menu opens.

3. Click on Validations.
   The Validations menu expands.

4. Scroll down through the menu and select Add network validation.

📘

Alternatively, you can use the search box at the top of the menu to search for Add network validation.

The Add Step window is shown.

5. In the Name the new step field, enter a (meaningful) name for this step.
6. If this is a shared step to be made available to reuse in this or other tests, keep the box next to Shared step selected (default), and choose a folder from the Select shared step folder list where you want this step stored. Otherwise, deselect the checkbox.
   For more information about shared steps, see Groups.
7. Click Create Step.
   The function editor opens, and the Properties panel opens on the right-hand side.

8. In the Properties panel, in the Description field, optionally edit the description of this step. The default description is “Run network validation”.
9. Define the parameters you will need for your step as follows:
   a. In the Properties panel, click the + PARAMS button.
   b. JS parameter: If you would like to add a JavaScript parameter, select JS from the dropdown list and type in the JavaScript parameter.
   c. HTML parameter: If you would like to define an HTML element as a parameter, select HTML from the dropdown list. The browser opens, displaying the relevant webpage for this step. Do the following:
   • In the AUT window, hover your mouse on the relevant element and then click on it to select it. The selected element is shown in the Target Element box in the Properties pane. If you would like to view, replace or adjust the settings for the selected element, use the procedures described in Editing Target Element Properties.

d. The selected element is automatically named “param” or “element” (depending on whether you chose a JS parameter or HTML element). To assign a relevant name to the parameter/element, click on the edit icon and enter the desired name.

10. Optionally fill in the following Properties:

• When this step fails – Specify what to do if this step fails.
• When to run step – Specify conditions for when to run the step. For more information, see Conditions.
• Override timeout – Allows you to override the default time lapse setting which causes Testim to register a fail for a test step, and specify a different time lapse value (in milliseconds).

11. In the function text box, type in the desired JavaScript code. If you have defined parameters, you can refer to those parameters in your JavaScript code.

📘

If you are using DOM selectors other than HTML parameters (e.g. jQuery), then empty arrays are truthy, so you need to use $(<query>).length instead of $(<query>).

12. Click the back arrow to return to the main Editor window.

📘

If you opened your AUT to define an HTML element as a parameter, click on the Toggle Breakpoint button to remove the breakpoint.

The step is created.

Network Validation Examples

Validate all the image requests

Example Code:

function validateRequestStatuscode(req){
  //Get status code
 const statusCode = req.statusCode.toString();
  //Check if we got an error
 const badReq = statusCode.startsWith('4')  || statusCode.startsWith('5');
  //If we got an error fail the step
  if(badReq){
    throw new Error(`assert failed for request "${req.url}" method: "${req.method}". Statusc code was ${req.statusCode}`); 
  }
}

console.table(networkRequests)
const imageCalls = networkRequests.filter(call => call.type == "Image");
imageCalls.forEach(validateRequestStatuscode)

Validate a single request

Example Code:

if(networkRequests.length == 0){
 throw new Error('No requests were made during the time of the test') 
}

function validateRequestStatuscode(req){
  //Get status code
 const statusCode = req.statusCode.toString();
  //Check if we got an error
 const badReq = statusCode.startsWith('4')  || statusCode.startsWith('5');
  //If we got an error fail the step
  if(badReq){
    throw new Error(`assert failed for request "${req.url}" method: "${req.method}". Statusc code was ${req.statusCode}`); 
  }
  return true
}

//Filter the source of the request
function filterReqestsBySource(source,req){
  const reqSource = req.source
  if(source === reqSource) return true
  return false
}

//find a single request by it's url and check if they are all valid

const singleReq = networkRequests.find(item => item.url == 'http://demo.testim.io/bundle.css')

if(!singleReq){
 throw new Error('Request was not found') 
}

return validateRequestStatuscode(singleReq)

Validate all requests have passed

Example Code:

function validateRequestStatuscode(req){
  //Get status code
 const statusCode = req.statusCode.toString();
  //Check if we got an error
 const badReq = statusCode.startsWith('4')  || statusCode.startsWith('5');
  //If we got an error fail the step
  if(badReq){
    throw new Error(`assert failed for request "${req.url}" method: "${req.method}". Statusc code was ${req.statusCode}`); 
  }
}


//Check all the requests and see if they are all valid 
networkRequests.forEach(validateRequestStatuscode)
return true

Validate max time of call

Example Code:

const callDur = networkRequests.map(call => call.endTime - call.startTime)

const isOverMax = callDur.some(time => time > maxTimeInMS)

if(isOverMax) throw new Error(`Some calls were over ${maxTimeInMS}MS`)

Example Parameter: