SAP Intelligent RPA: How to call UI5 library functions on captured UI5 controls

Introduction

If you are familiar with SAP Intelligent RPA and your work demands automating Web applications based out of different UI frameworks, you can follow the steps mentioned in this blog to write client side scripts in your Bot’s codebase and directly use framework’s library functions to control UI actions and events.

In this blog post, we will take sap.m.MultiInput as an example. The framework used here is SAP UI5 (v 1.77.2). The SAPUI5 library provided by SAP Intelligent RPA doesn’t include features like removeAllTokens, getText etc. methods for sap.m.MultiInput and since the control is used by a lot of standard SAP S/4HANA applications, adding client side scripting to the code makes it easy to automate business processes supported by these applications.

You can find the git project here

Pre-Requisites:

• You have a valid licence for to use SAP Intelligent RPA. You can get started with the free trial version using this link.
• You have installed Desktop Studio and Desktop Agent along with other required components on your system. (You can follow the installation guide for same)
• Enable the SAP Intelligent RPA for your browser. (Help Link)

Overview: 

There are three steps specific to leveraging a framework functionality to enhance capabilities of the SAP Intelligent RPA web automation 

• Declare a Global Function that has the functionality specific code (step 4) 
• Inject the function into the relevant page (step 5) 
• Invoke the function from the target control (step 5) 

Steps:

1. Create a new Project -> Add an Application (Choose Web under technology) -> Capture the UI5 MultiInput Sample Web Page (Link)

2. Declare the page and related controls (highlighted in the screenshot)

3. Create a simple Workflow -> Start Application -> Add captured page

4. Add code snippet for handling UI5 control using client-side scripting

Code Snippet

var sap={};

function multiInputFunctions (oControl, param){

    console.log(param); //Writes the passed parameter on browser console

    var ui5Control = sap.ui.getCore().byId(oControl.getAttribute("id"));

    console.log(ui5Control.getTokens()[param].getText()); //Fetches the token by index and puts 
    //it on console

    ui5Control.removeAllTokens(); //UI5 function to remove all tokens from sap.m.multiInput

};

5. Inject script function in the page and call the function on the captured control

Code Snippet

GLOBAL.step({ pSamplesDemoKit_manag: function(ev, sc, st) {

     var rootData = sc.data;

     ctx.workflow('multiInputFunctions', '42cc6dc0-400d-4d61-bf16-dfe63b7f2950') ;

     // Wait until the Page loads

     SamplesDemoKit.pSamplesDemoKit.wait(function(ev) {

     try

     {

         SamplesDemoKit.pSamplesDemoKit.injectFunction(multiInputFunctions);

      }

      catch(error)

      {

         ctx.log('INFO:: Error caught during injectFunction on page '+error? error.message : '');

       }

      SamplesDemoKit.pSamplesDemoKit.o__xmlview1MultiInpu.execScript('multiInputFunctions',2);

      sc.endStep(); // end Scenario

      return;

  });

}});​

Output:

Conclusion:

Client-side scripting can be used in SAP Intelligent RPA to call control specific functions and events not embedded otherwise in Studio.

However, it should be used only in case where accessing the control functionality is not possible using inbuilt SAP Intelligent RPA libraries and activities.

Thanks,

Piyush Gupta

Co-Author: Narayan VK

Source for Pre-requisites Section :  How to start SAP Intelligent RPA bot on click of Fiori element