Write a Javascript Command

Create a javascript command

  1. Navigate to Custom Command in the left-side menu bar, click + button to generate a group command.

  2. Enter the javascript command info.

    Notes The scope field has two options, the private means the command can be used only in current project, the public means the command can be used in other projects. By default, the value is private. You can input the {Parameters.XXX} as verbalization. The parameter is defined in this JS. XXX is the parameter key name you defined in this custom js.

  3. Define the javascript command parameter. You can refer these parameters’ value through verbalization. For example: {Parameters.myKey}. You can configure a list of possible values of the parameter, separated by comma.

  4. Define your javascript command content.

  5. Add your javascript command in your test case. If you have configured the list of possible values of the parameter, you can select from the parameter dropdown list.

  6. You can refer js variable in the case step.

  7. Refer to Javascript API Reference for OOTB Javascript functions

Javascript Command sample

In Hiring sample Standard_HR_Open_New_Position/case2, we will change the number of employees to value 3 if we choose Position Request Department as Sales.

Here are the steps:

  1. We create a js testCommand named change sales number
  2. Copy the below js command content into this js command.
var controlId='Section1.Section4.Requisition_CV1.Section1.Single_Select2';   
var textId='Section1.Section4.Requisition_CV1.Section1.Text3';   
var coachView;   
var inputElement;   
var selectedValue = [];  
if (controlId) {   
    coachView = bta.util.getCoachViewByControlId(controlId);     
}   
var selectElement;   
if (coachView) {   
	selectElement = coachView.context.element.querySelector("select.form-control");     
	if (bta.util.isElementTag(selectElement, "select")) {   
	    var selectOptions = selectElement.options;   
	    for (var i=0; i<selectOptions.length; i++) {   
	    	 if (selectOptions[i].selected) {                 
	    		if (selectOptions[i].text=='Sales'){                 
                   var textView = bta.util.getCoachViewByControlId(textId);                 
	           inputElement = textView.context.element.querySelector("input.form-control");	   
                    if (inputElement) {        
                      inputElement.value=3 ;   
                      }    

 	    	 }   
      	       }   
           }      
        }   
}    
return bta.util.callback();

  1. Insert this js command in the Submit position request task UI.

  2. When you record/replay this case again, you will find when you select the department value as sales , the number of employee value is 3.

Post Custom JS Command

This feature allow you to inject a custom JS command to the case steps in bulk.

The classic use case:

Issue: In some user interface test cases, you may need to request data from the server. If the response time is too long, it will block the later case steps and cause the test case to fail.

Solution: Add a customized javascript which waits for the request to complete as post script and insert it after the case steps that trigger the request.

Here is the steps:

  1. Post Script function is disable by default and user should enble it in project configuration.

    Step1: Edit the project

    Step2: Add “post_script”:true in Engine Properties.

  2. Create Post Custom Command:

    Global level: Create a javascript command named ida_post_script in Administration -> Custom Command. Then the post script toggle will shown in the case step edit table. And allow all projects of your system to insert post script after UI/JS commands.

    Project level: Create a javascript command named ida_post_script in one project. Then the post script toggle will shown in the case step edit table of this project. And allow this project to insert post script after UI/JS commands. It will overwrite the global level post script.

    Test Case level: Create a javascript command named ida_post_script_[project Id]_[test Case Id] in one project. Then the post script toggle will shown in the case step edit table of this test case. And allow this test case to insert post script after UI/JS commands. It will overwrite global level and project level post script.

    Default post script:

     console.log("Start to run post script!");
 var timeout = 10;
 var interval = 2;
 var parameter = {
     elementId: "",
     elementCss: "img[alt='Loading']",
     xpath: ""
 };
 bta.util.waitElement(parameter, {
      visibility: "Visible",
      timeout: timeout,
      interval: interval
 }, function(status){
   if (status === "success") {
     bta.util.waitElement(parameter, {
          visibility: "Hidden",
          timeout: timeout,
          interval: interval
     }, function(){
       bta.util.callback();
     });
   } else {
     bta.util.callback();
   }
 });

    You can configure timeout, interval, elementId, elementCss and xpath as you need.The default sample will wait some time util loading icon(img[alt=’Loading’]) disapper(Usually it is located on right top of the UI).It applys for long loading ajax service or Long time UI loaing.

    Also you can change the post script to meet your needs.It will run js after every command you apply for ida_post_script. When you replay the test case you can open the web console to debug your test case.For example:

     console.log("Start to run post script!");
 setTimeout(function(){ }, 3000);

  3. Insert Post Script to Case Step

    If you have created any level of the post script then the layout of case step table:

    Click the toggle can insert post script after the command.

    Batch operation:

    Select the case steps, right click then click On/Off button.

Categories:

Updated: