System UI - UI Scripts - ATF Custom UI Step Config

[Shan C]

Hello - This might be an old question, but trying to get some answers or is there any workarounds for this.

I am trying to keep the common library of functions in one place, and want to use inside my custom UI step config definitions, instead maintaining duplicate copies in each/every custom UI step config.

So, I understood like System UI - UI Scripts is for client-side actions, and Script Includes for server-side tasks.

Both the System UI - UI Scripts and SCRIPT ICNLUDES are not showing or accessible inside the custom UI step config scripts.

Is there any business rules or polices that should be modified or it is not intended or cannot be used this way?

Appreciate any inputs on how I can use them or enable to access them inside the UI step config.

[lauri457]

You will not be able to call server-side code directly in a ui step because the test is running on the browser (or cloud runner). You'd have to use glideajax or apis or whatever. Of course it would be better if you just get whatever inputs you need from a server-side step which you then carry over to the ui step. As for ui scripts they have to be globally available or loaded for your page via a js include or a script. 

So no workarounds needed, just load the ui script in the test config script, note the asynchronicity. 

ScriptLoader.getScripts("Test.jsdbx", callback);
function callback() {
	uiscriptFunction()
}

I'd also argue it's a better design choice to try and make step configs small and isolated so they are reusable in different scenarios rather than trying to write the test logic into the step configs.

[Shan C]

Thanks @lauri457 for giving some hope.

I have tried like this:

1. Created an UI Script like below. 

var ATFAllUtils = {    
        test_ui: function() {
			alert("-------- HELLO - I AM TEST_UI-----");
			console.log("-------- HELLO - I AM TEST_UI-----");
            return;
        }
};

2. Called this test_ui function from my step config like below.

assertionObject.executeStep = function(step, stepResult) {		
		ScriptLoader.getScripts("ATFAllUtils", my_call_back);

		alert("-----------------HELLO MY STEP CONFIG A------------------");
		passStep();
};

function my_call_back() {
	test_ui();
}

 This time, I didn't get any error but I am not seeing any messages that I have passed too. I can see only the alert message that inside my executeStep(HELLO MY STEP CONFIG A).

Could you pls let me know what I am doing wrong here. Appreciate the help.

[lauri457 · Accepted solution]

The first parameter for getScripts is the name of the ui script record + ".jsdbx". And you still need to call the method of the object as you didn't declare a global function.

var ATFAllUtils = {    
        test_ui: function() {
			alert("-------- HELLO - I AM TEST_UI-----");
			console.log("-------- HELLO - I AM TEST_UI-----");
            return;
        }
};
//...
assertionObject.executeStep = function(step, stepResult) {		
		ScriptLoader.getScripts("ATFAllUtils.jsdbx", my_call_back);

		alert("-----------------HELLO MY STEP CONFIG A------------------");
		passStep();
};

function my_call_back() {
	ATFAllUtils.test_ui();
}

Scriptloader is just an api to control how the script tags are loaded so probably you will have to remember to kill the test runner every time you make changes to the ui script (unless you load the ui script to the iframe inside the runner).  It's also good to remember that ui scripts are cached so if you make changes to the ui script and they don't show you might need to flush system cache as well. 

[Shan C]

@lauri457 Thanks for the solution. It works, and need to clear cache/refresh the runner to see the new script changes.

Just one more help. How I can get the return value from those functions defined inside the UI Script. I have tried to use a global variable as well but no luck. Appreciate if any examples or tips.