How to Create Transaction Code to Launch SAPUI5 Application

[ChandraMahajan]

Introduction

Most of the time Business Analyst is the person who is involved in testing of the development objects. And this person used to launch various reports using transaction code for testing. Now in case of testing UI5 application (or for that matter WDA or BSP application), it becomes difficult for them to navigate to SE80 then open UI5 (BSP)application, right click it and test ! Also by default, it opens the application in IE browser.

I was looking for solution to solve this problem and then I remembered that to open theme designer, we need to execute transaction code /UI5/THEME_DESIGNER which then opens the theme designer web application. I thought why cant we use similar approach to launch UI5 application. And this is the document where I will share those details.

As displayed in below screen, This is the Object Transaction having class and method name to launch the Theme Designer.

So now let's observe the code in the method LAUNCH_THEME_DESIGNER of class /UI5/CL_THEME_TOOL. We have everything required to launch UI5 application. We just need to change the url !

Solution

Create new Class say ZCL_LAUNCH_UI5 with public method LAUNCH_UI5_APP having below code. (Copy from method LAUNCH_THEME_DESIGNER and  do the required modification as explained in code)

METHOD launch_ui5_app.

  DATA l_url          TYPE string.

  DATA l_char_url     TYPE char1024.

  DATA l_parameter    TYPE ihttpnvp.

  DATA l_parameters   TYPE tihttpnvp.

  DATA l_html_viewer  TYPE REF TO cl_gui_html_viewer.

  l_parameter-name = 'sap-client'.

  l_parameter-value = sy-mandt.

  INSERT l_parameter INTO TABLE l_parameters.

  DATA l_lang(2).

  CALL FUNCTION 'CONVERSION_EXIT_ISOLA_OUTPUT'

    EXPORTING

      input = sy-langu

    IMPORTING

      output = l_lang.

*Additional URL paramater for UI5 application (Language and APP Cache)

  l_parameter-name = 'sap-ui-language'.

  l_parameter-value = l_lang.

  INSERT l_parameter INTO TABLE l_parameters.

  l_parameter-name = 'sap-ui-appcache'.

  l_parameter-value = 'false'.

  INSERT l_parameter INTO TABLE l_parameters.

  l_url = /ui5/cl_theme_util=>get_server_url( path = '/sap/bc/ui5_ui5/sap/zflightapp/index.html'  parameters = l_parameters  always_https = abap_false  ).

**P.S. - You can launch any WDA/BSP application. Below is the url to launch WDT_ALV Webdynpro ABAP Application

*  l_url = /ui5/cl_theme_util=>get_server_url( path = '/sap/bc/webdynpro/sap/wdt_alv'  parameters = l_parameters  always_https = abap_false  ).

  l_char_url = l_url.

  DATA l_platform TYPE i.

  l_platform = cl_gui_frontend_services=>get_platform( ).

  IF l_platform <> cl_gui_frontend_services=>platform_macosx AND l_platform <> cl_gui_frontend_services=>platform_linux.

    " Chrome should be used for the UI5 Application on windows

    " Therefore we first try to launch chrome.

    " If it fails we fall back to the default browser.

    REPLACE ALL OCCURRENCES OF '"' IN l_url WITH '%34'.

    CONCATENATE '"' l_url '"' INTO l_url.

    CALL METHOD cl_gui_frontend_services=>execute

      EXPORTING

        application = 'chrome.exe'

        parameter  = l_url

      EXCEPTIONS

        OTHERS     = 1.

    IF sy-subrc = 0.

      RETURN.

    ENDIF.

  ENDIF.

  TRY.

      DATA l_empty_co TYPE REF TO cl_gui_container.         "#EC NEEDED

      CREATE OBJECT l_html_viewer

        EXPORTING

          parent = l_empty_co.

      CALL METHOD l_html_viewer->('DETACH_URL_IN_BROWSER')

        EXPORTING

          url = l_char_url.

      cl_gui_cfw=>flush( ).

    CATCH cx_root.

      CALL FUNCTION 'CALL_BROWSER'

        EXPORTING

          url                   = l_char_url

        EXCEPTIONS

          frontend_not_supported = 1

          frontend_error        = 2

          prog_not_found        = 3

          no_batch              = 4

          unspecified_error     = 5.

      IF sy-subrc NE 0.

        MESSAGE e001(00) WITH 'Cannot start browser'(108).

      ENDIF.

  ENDTRY.

ENDMETHOD.

Note - In the code there is call to static method GET_SERVER_URL of Class /UI5/CL_THEME_UTIL. You may want to create similar method in your Z class and use it OR use this standard method as it is.

Now create new transaction code using SE93 (Maintain Transaction).

Create OO Transaction as below

Provide Class and Method name. You can provide authorization object as well and then save it.

Now execute Tcode ZLAUNCH_UI5_APP

This will open your UI5 application in Chrome browser. Here is the output.

Conclusion

With this simple approach, you will be able to launch UI5 application using Transaction code. also once you transport this transaction code to Quality and Production system, you need not to worry about host server url as it will be read from method GET_SERVER_URL in the code.

I hope your BAs will be happy to see the transaction code for UI5 application!

Your comments and suggestions are most welcome. Please feel free to provide feedback/improvements and any other similar approach.

Happy Learning & Coding

PS. - With this approach, you will be able to launch any BSP and WD ABAP application. You can use Creating Parameter Transactions for Web Dynpro Applications - ABAP Workbench Tools - SAP Library for launching WDA as well !

PPS - Thanks to SAP for Transaction /UI5/THEME_DESIGNER !