5Steps2FIORI

Gain hands-on experience in FIORI activation and

configuration
PARTNER
TABLE OF CONTENTS
INTRODUCTION ..................................................................................................................................................... 3
TROUBLESHOOTING AND PERFORMANCE ANALYSIS ................................................................................... 4
Exercise – Part 1: SAP UI5 Libraries ................................................................................................................... 4
Exercise – Part 2: Understanding Webdynpro/WebGUI resolution .................................................................. 9
Exercise – Part 3: Improving Webdynpro/WebGUI performance ................................................................... 12
Exercise – Part 4: SAPUI5 Fiori App Troubleshooting .................................................................................... 14
Exercise – Part 5: Finding source objects ........................................................................................................ 25
Exercise – Part 6: Optimizing Performance ...................................................................................................... 36

2
INTRODUCTION
This document has the scope to explain you the steps required to complete all the activities planned for the
current work-package.

By executing the steps described in this document you will be able to understand the main procedures required
to select and activate Fiori Applications in your implementation project.
Note that the steps described in this document refer only to the technical activation steps, additional functional
activation steps may be needed depending on the application scope. The required functional steps are described
in the Fiori Apps Library.

3
TROUBLESHOOTING AND PERFORMANCE ANALYSIS
In these exercises you will go through the most common steps to troubleshoot Fiori applications,
including:

▪ SAPUI5 Libraries
▪ Webdynpro/WebGUI configuration
▪ Fiori App Dependencies

Exercise – Part 1: SAP UI5 Libraries

In this exercise we will explain how to check the current SAPUI5 library versions and how to update
them.

Estimated execution time: 1 hour

Comment Screenshot

1. Open your Fiori Launchpad in Chrome using

transaction /n/UI2/FLP. Once open, make sure you
also open the Web Developer Tools.

**Make sure you open Fiori Launchpad with FIORIUSR ID and

only assign the frontend role ZTZPO_ROLE. Double check if
you need to remove the following roles:
SAP_BR_AA_ACCOUNTANT
SAP_BR_INTERNAL_SALES_REP
SAP_BR_PRODN_PLNR

2. Once the Developer Tools are open, switch to the

“Console” tab. There you will already find some error
messages. Make sure you clear the console errors by
clicking on the icon.

**We recommend always clearing the errors shown in the

“Console” and “Network” tab so when you reproduce an error
only the messages related to the error are displayed.

3. With the error logs clean, refresh the Fiori Launchpad

by “long-pressing” the refresh button and selecting
the “Empty Cache and Hard Reload” option

4
Comment Screenshot

4. Once Fiori Launchpad finishes loading you should

see only see an error related to the
/IWNGW/NOTIFICATION service of Notifications
area.

**We will analyze this error in the following exercises, for

the moment we will skip this.

5. Clear the console and type the following text to obtain

your current SAPUI5 library version

sap.ui.version

6. To find the latest available version of SAPUI5

libraries go to
https://sapui5.hana.ondemand.com/versionoverview.
html and search for your version number (1.65)

**You will notice that version 1.65 is on Maintenance

status, meaning that you can use this version as a stable
production library until the end of maintenance date.

7. If for some reason you wish to update the libraries,

you have two options:

▪ Option 1: Update SAP_UI add-on component to latest

available “Maintenance” version.

▪ Option 2: Manually update SAPUI5 libraries through

Note implementation.

For either of these options you must identify the target library
version. To do so, find the latest available versions at:
https://sapui5.hana.ondemand.com/versionoverview.html

**For this scenario we will explore option 2 and we will

aim for SAPUI5 1.65.14

8. We will manually update SAPUI5 to version 1.65.14

so we need to search for the required SAP Note
using the keywords: “SAPUI5 ABAP 1.65”

**You should find note: ABAP SAPUI5 1.65 release

(2802680).

5
Comment Screenshot

9. Open Note 2802680, scroll to the Manual Activities

section and take note of File Name required for
download and any associated notes to version
1.65.14.

10. From the support launchpad you can download the

required file and install using the Solution instructions
in note 2802680

https://launchpad.support.sap.com/#/softwarecenter/search/UI
5CLIENT60P_3-80000549.ZIP

11. Once the download of the UI5 library has concluded,

run report /UI5/UI5_UPLOAD_PATCH_TO_MIME in
transaction SE38.

12. In this report, enter the path to the downloaded

SAPUI5 library, ensure the checkbox for Test Mode
is active and run the report

13. Wait for the program to conclude execution. Report

should run for about 20-30 minutes.

6
Comment Screenshot

14. Once execution in Test Mode is concluded, make

sure there are no errors listed in the log. You can do
this by filtering values in column Action

**You will not find green or red icons in the report as the
report has been changed in recent releases. This is
described in SAP Note 2641440

15. Once you have ensured no issues are identified,

create a new Workbench request in transaction SE10
and run report
/UI5/UI5_UPLOAD_PATCH_TO_MIME specifying
your workbench request number and ensuring Test
Mode is deactivated

16. Report execution should finish successfully.

**For subsequent systems like QA and PRD you could

release this transport and import when needed. For this
exercise you do not need to release or move your
transport orders

7
Comment Screenshot

17. Run the following reports to clear cache for all users
in the system in the proposed order using transaction
SE38:

/UI2/CHIP_SYNCHRONIZE_CACHE
/UI2/DELETE_CACHE_AFTER_IMP
/UI2/INVALIDATE_CLIENT_CACHES
/UI2/INVALIDATE_GLOBAL_CACHES

We also recommend refreshing your Fiori Launchpad and

clearing browser cache

18. To ensure you are now loading the updated version

of the library, run the command sap.ui.version in the
browser developer tools console

**You will find the version number does not match the
library version number you updated.

19. To obtain the real version numbers we recommend

using the keyboard shortcut Ctrl+Shift+Alt+P on
Fiori Launchpad home page to check it.

20. A second option is opening the following url:

https://<host>:<port>/sap/public/bc/ui5_ui5/index.html

**Additional options to find out the SAPUI5 Library versions

are described in SAP Note 2363155

8
Exercise – Part 2: Understanding Webdynpro/WebGUI resolution
In this exercise we will explain how to check the Webdynpro/WebGUI configuration and how to
troubleshoot common errors.

Estimated Execution Time: 10 minutes

Steps / Comments Screenshot

1. Open Fiori Launchpad with FIORIUSR ID

and make sure you assign the frontend
role Z_FIORI_FOUNDATION_ADMIN and
open Chrome Developer Tools.

**Ensure you clear Console and Network logs in

Developer Tools

2. Before you continue, you must identify the

RFC mapping to system aliases used to
solve Webdynpro and WebGUI by
understanding that Webdynpro/WebGUI
apps require the definition of various
RFC’s named after some specific system
alias defined in the SAP S/4HANA
standard.

**You can easily find the required System Alias

names by opening table /UI2/V_SYSALIAS in
transaction SM30 with a total of 35 System Alias

3. In transaction SM59 two RFC’s have been

created by the task lists:
▪ FIORI_FLP_RFC
▪ FIORI_FLP_HTTP(S)

**<SYSALIAS>_RFC are mainly used for catalog

replication whereas <SYSALIAS>_HTTP(S) are
mainly used for target mapping resolution of
Webdypro/WebGUI apps.

9
Steps / Comments Screenshot

4. The task list has already defined the

mapping of all standard system alias to
the RFC connections mentioned before.
To review this configuration view table
/UI2/V_ALIASMAP in transaction SM30

**In table /UI2/V_ALIASMAP you will notice that all

standard System Alias have no mapping, this is
due to the fact that we are doing an Embedded
Deployment.

5. In transaction SM59 you can notice that

the RFC’s are aiming to:

Hostname: linux-fsXX.kmudemo.site
Port: 443XX

**This data should correspond to the hostname

and port you defined during task list run.

10
Steps / Comments Screenshot

6. Using FIORIADM, try opening any tile

from the SAP Fiori Launchpad Admin
Group or with App Finder you will notice
all Web Dynpro and SAP GUI for HTML
based apps open without issues.

**A simple way to identify which app type you are

running is reading the url of the displayed app and
search for the hint: Shell-startGUI or Shell-
startWDA to help you identify the app type.

11
Exercise – Part 3: Improving Webdynpro/WebGUI performance
In this exercise we will explain how to easily improve Webdynpro and WebGUI performance in the
Fiori Launchpad, however, it is important to note that most of the improvements for these technologies
are delivered through the kernel.

12
Steps / Comments Screenshot

1. Login with FIORIADM and run transaction

/UI2/FLP_CUS_CONF

2. In the FLP Configuration folder enter the

following parameters:

FLP Property Value

NAVIGATION_GUI true
_INPLACE
NAVIGATION_WD true
A_INPLACE
NAVIGATION_GUI true
_STATEFUL_CON
TAINER

3. By activating these settings, you will now

be able to see that Webdynpro apps are
loaded in the same browser tab as you
have now enabled “INPLACE” navigation.
Additionally, when using WebGUI apps
the required libraries will only be loaded
once, hence you should notice faster
performance when opening various
WebGUI apps.

13
Exercise – Part 4: SAPUI5 Fiori App Troubleshooting
In this exercise we will explain SAPUI5 Fiori app configurations and how to troubleshoot common
errors.

14
Steps / Comments Screenshot

1. Open Fiori Launchpad with your

FIORIADM ID and make sure you assign
the following roles:

Z_BR_ADMIN_APR_FICA
Z_BR_ANALYTICS_SPECIALIST
Z_BR_APR_ACCOUNTANT_FICA
Z_BR_BUSINESS_PROCESS_SPEC
Z_BR_BUYER
Z_BR_COLL_SPECIALIST_FICA
Z_BR_PROJ_FIN_CONTROLLER
Z_BR_PROJ_LOG_CONTROLLER
Z_BR_PURCHASING_MANAGER
Z_BR_PURCHASER

**Ensure you clear Console and Network logs in

Developer Tools and keep the Network tools open.

2. Navigate to the “Inbox” group. You will

notice an error message is displayed in
the tile.

3. In the Network tab select the request that

is displayed in red. You should now see
additional details.
4. Click on the Preview tab and expand the
error message details.
5. In support search portal search for the
text:

“Task Facade not implemented for provider”

You should find note 2348671

6. Go to transaction
/IWFND/MAINT_SERVICE and search for
external service name
“TASKPROCESSING”. System Alias
assignment should be missing.

**The missing system alias is caused by the

activation in Co-deployed mode, so this is the
expected behavior of this service.

15
Steps / Comments Screenshot

7. Before you continue, select the service

and click on the “Processing Mode”
button to switch the processing mode to
“Routing-based”

8. Click on the button “Add System Alias”

and when the settings screen is displayec
click on the “New Entries” button.
9. Enter system alias name “LOCAL_TGW”
and press enter (this alias was created by
the task lists).
10. Save the changes and enter a
customizing request.

11. Refresh your browser session and

navigate back to Inbox group. You should
no longer notice any error with this app.

12. Open the notifications area. When doing

this you should see an error prompt, and
you should also notice errors in the
browser’s developer tools console.

16
Steps / Comments Screenshot

13. Open the error details in the Network tab

of the developer tools and you will notice
error code 403.

14. This is expected behavior as the

notifications service is a “special” service
built with OData V4 which requires
manual activation.
15. First step is to check the activation of the
OData v4 service in transaction SICF

16. You should also check the activation of

the following node in transaction SICF:

/sap/bc/apc/iwngw/notification_push_apc

17
Steps / Comments Screenshot

17. In transaction SPRO navigate to the

activity “Publish the Notification OData
Service”

18. Click on the “Publish Service Groups”

button

19. Search for all the Service Groups of

system alias LOCAL

18
Steps / Comments Screenshot

20. Select the Notifications service and click

on the “Publish Service Groups” button.
21. For the activation you will be prompted for
a Customizing request.
22. Upon successful activation a pop-up will
confirm the correct procedure

23. Create new role

Z_FIORI_NOTIFICATIONS and assign
the following authorization objects:

Authorization Object: S_START

AUTHPGMID: R3TR
AUTHOBJTYP: G4BA
AUTHOBJNAM: /IWNGW/NOTIFICATION

**When you enter the values, make sure you select

type: “SAP Gateway OData V4 Backend Service
Group & Assignments”

19
Steps / Comments Screenshot

24. Save, generate the role and assign it to

user FIORIADM.
25. Perform a hard-reset clearing cache and
you should no longer receive any error.

20
Steps / Comments Screenshot

26. Despite you can no longer find any errors,

this does not mean the Notifications are
working completely. To do this you will
need to run the following configurations.
27. In transaction SPRO navigate to the task
“Enter the Notification Hub RFC
Destination”
28. The value for this RFC should be NONE

21
Steps / Comments Screenshot

29. In task “Enter the Backend System

Alias” set the value to LOCAL

22
Steps / Comments Screenshot

30. In task “Manage Notification Provider

Enablement” activate two notification
providers:
SAP_BUSINESS_WORKFLOW and
/IWNGW/DEMO

31. Run transaction /IWNGW/BEP_DEMO to

send a dummy notification to user
FIORIADM using the default notification
provider

23
 Steps / Comments Screenshot

32. In the Launchpad of user FIORIADM you

should now see a notification item

You have finished basic troubleshooting of the apps all apps in the roles you activated. Technical check
is concluded and your functional team can start testing the apps.

24
Exercise – Part 5: Finding source objects
In this exercise we will explain how to find source objects in an OData service.

Please note that there are several development approaches, hence, you will find several options to
identify which objects are being consumed by the OData services.

To find out more, visit: Fiori for S/4HANA – Troubleshooting Tips and Tricks in S/4HANA On-
Premise

25
Comment Screenshot

1. Open Fiori Launchpad with your

FIORIADM ID, open App Finder,
navigate to group “Supplier and
Category Management – Category
Management” and open app
Display Suppliers – Procurement.

2. Once the app is displayed, open your

browsers developer tools, clear
network and console tabs and
perform a hard-reload.

26
Comment Screenshot

3. In the network tab, filter requests with

the keyword “$batch”

4. Select the second entry from the list

and scroll down to the Request
Payload section of the network detail
pane.

5. As this is a batch call, we will need to

manually “rearrange” the web call to
identify which operation is being
executed. To do this copy and paste
the contents from the web request to
a text file and append the highlighted
section from the Request Payload
details to the highlighted section in
the General details area.

27
Comment Screenshot

**Expected result:
https://<hostname>:<port>/sap/opu/odata/sap/C_SLCMGMTSUP
PLIERPORTFOLIOST_SRV/C_SLCMgmtSupplierPortfolio?sap-
client=100&$skip=0&$top=25&$orderby=SupplierName%20asc&
$select=Supplier%2cto_SupplierValueHelp%2fOrganizationBPNa
me1%2cCountry%2cto_MM_CountryValueHelp%2fCountryName
%2cCityName%2cIsPreferredSupplier%2cto_IsPreferredSupplier
%2fIndicatorValue_Text%2cBusinessPartner&$expand=to_MM_
CountryValueHelp%2cto_IsPreferredSupplier%2cto_SupplierValu
eHelp&$inlinecount=allpages

6. Copy the resulting URL into a

browser tab and you should see the
data that is retrieved by the OData
service.

7. We will now dissect the OData

service call to quickly understand its
structure

28
Comment Screenshot

8. Go to transaction SEGW and open

project Technical Service Name
Available OData
Operations
C_SLCMGMTSUPPLIERPORTFOLI
OST to understand the relation of the
OData structure to the ABAP
development definition

Associated OData Entity

Type

OData Entity SET

9. In this case, apart from relating the

OData structure to the SEGW OData
project you should have noticed that
the service is composed of CDS
views rather than ABAP code.

**This means that the SEGW project only

acts as a wrapper, troubleshooting of data
extraction should be done by analyzing
CDS views

10. Before we continue to analyze the **Sample URL:

CDS view, we can try using the https://<hostname>:<port>/sap/opu/odata/sap/C_SLCMGMTSUPPLIERP
debug mode in the browser to ORTFOLIOST_SRV/C_SLCMgmtSupplierPortfolio?sap-ds-debug=true
understand how navigation in the
service. By clicking in the formatted
links you will be able to navigate
between the entities of the service

29
Comment Screenshot

11. In your remote desktop client open

SAP HANA Studio client from the
start menu.

12. Select the default workspace

directory and make sure the ABAP
perspective is selected by going
through the path:

Window >> Perspective >> Open

Perspective >> Other >> ABAP

**Ensure ABAP perspective is selected

30
Comment Screenshot

13. With the ABAP perspective

displayed, create a New ABAP
project

14. Select the Backend system you wish

to connect to and double check
connection details if required.

15. Enter your username and password

and click on “Finish”

31
Comment Screenshot

16. Once the project has been created

select the “Open ABAP

Development Object” button

17. A search help menu will be displayed

and now you can search for any
ABAP Object (table, structure,
program, class, etc).

18. In this case you will need to search

for the CDS view Data Definition
that matches the EntitySet name:

C_SLCMgmtSupplierPortfolio

19. Double click on the Data Definition

object to display the details.

20. Scroll down until you find the “Define

statement” of the CDS view. There,
you will find that this CDS is made
out of several joins and associations
to other CDS views, additionally, you
will notice some words are displayed
in blue color. These are the UI
annotations, and these helps defining
which fields will be displayed in the
Fiori Application.

32
Comment Screenshot

21. You can get a preview of the data by

running the CDS view as an ABAP
program and entering the currency
parameter value.

**You will notice the data displayed in ADT

is the same as the information displayed in
the SAPUI5 Fiori Application.

22. You can easily identify which other

CDS views and tables are being
used by this CDS view by opening
the Dependency Analyzer.

33
Comment Screenshot

23. With Dependency Analyzer you can

quickly identify which tables are
being used to extract information and
you can also get an overview of the
complexity of the query.

24. Switch to the graphical view to easily

identify the Data Model Structure of
this OData Entity and the Tables that
are being consumed by the CDS
view.

**As you may have already noticed,

sometimes troubleshooting will require
analyzing the extraction procedure of the
CDS view including the joins or
associations defined.

34
Comment Screenshot

25. One final CDS object that is worth

reviewing is the DCL or Data Control
Layer. Search for the ABAP Object
C_SLCMgmtSupplierPortfolio and
select the “Access Control” object

26. In this object you will find the

Authorization Objects required to
execute and display information
using the CDS view along with the
activity type required. Note that, in
some cases like this example,
authorizations are inherited from a
different CDS view.

**It is a common error not to assign the

required authorization objects to end
users, by reviewing the Access Control
object you can quickly identify which
authorization objects are required for CDS
execution

Note that not all CDS provide Access

Control Objects

35
Exercise – Part 6: Optimizing Performance
In this exercise we will explain how to easily improve performance of the Fiori Launchpad. Please note
that there are several causes why Fiori Launchpad performance may be affected and this exercise is for
demonstration purposes only. To find out some performance tips and tricks, visit: Fiori for S/4HANA –
Performance Tips and Tricks in S/4HANA On-Premise

It is important to note that some apps have already been identified along with specific performance
limitations. For further reference, read note 2837072

36
Comment Screenshot

1. Open Fiori Launchpad Designer with

your ADMIN ID, using transaction
/n/UI2/FLPD_CUST, log in and
validate the existence of Catalog:
/UI2/CONFIG/UI5/CDN

2. Copy this catalog to a new custom

catalog called ZFIO_PERF by
selecting and dragging the Catalog

37
Comment Screenshot

3. Open the new Catalog ZFIO_PERF,

navigate to the “Target Mapping”
section and click on “Configure”

4. Add the following parameter:

/ui5/cdn/url = https://sapui5.hana.ondemand.com/1.71.11/resources

5. Create a custom role ZFIO_PERF in

transaction PFCG and assign custom
catalog ZFIO_PERF to your user ID.

6. Refresh the browser to visualize the

changes

**You will notice loading of the UI5 libraries

is made through CDN making it faster to
load, additionally, you are now using UI5
libraries version 1.71.11 with the latest UI5
performance innovations.

**Keep in mind, that the recommendation is

to upgrade SAP_UI component to obtain
the latest UI5 library versions

38
Comment Screenshot

7. Start a Performace analysis using

Chrome Developer Tools by
reloading the Fiori Launchpad,
clearing all cache, next, click on the
Reload button of the Performance
Analysis Tools

8. Focus on the Performance analysis

summary. In this example, complete
loading of the Launchpad takes 5.3
seconds

9. Remove the Role ZFIO_PERF from

your user. Clear Developer Tools
Performance results reload the
Launchpad and run a new
performance analysis.

10. Review summary and compare

results. In this case, complete loading
of the Launchpad takes 5.9 seconds

11. Note that due to the caching of the

libraries in both scenarios you will
obtain better results as you continue
to refresh the page. In this example,
after refreshing the Launchpad the
performance improved up to 5.2
seconds using CDN.

39
Congratulations, you have now finished troubleshooting and improving performance of the Fiori
Launchpad.

40
www.sap.com/contactsap

© 2018 SAP SE or an SAP affiliate company. All rights reserved.

No part of this publication may be reproduced or transmitted in any form or for any purpose without the express permission of SAP SE or an SAP affiliate company.

The information contained herein may be changed without prior notice. Some software products marketed by SAP SE and its distributors contain proprietary software components of other software vendors. National product
specifications may vary.

These materials are provided by SAP SE or an SAP affiliate company for informational purposes only, without representation or warranty of any kind, and SAP or its affiliated companies shall not be liable for errors or
omissions with respect to the materials. The only warranties for SAP or SAP affiliate company products and services are those that are set forth in the express warranty statements accompanying such products and services, if
any. Nothing herein should be construed as constituting an additional warranty.

In particular, SAP SE or its affiliated companies have no obligation to pursue any course of business outlined in this document or any related presentation, or to develop or release any functionality mentioned therein. This
document, or any related presentation, and SAP SE’s or its affiliated companies’ strategy and possible future developments, products, and/or platform directions and functionality are all subject to change and may be changed by
SAP SE or its affiliated companies at any time for any reason without notice. The information in this document is not a commitment, promise, or legal obligation to deliver any material, code, or functionality. All forward-
looking statements are subject to various risks and uncertainties that could cause actual results to differ materially from expectations. Readers are cautioned not to place undue reliance on these forward-looking statements, and
they should not be relied upon in making purchasing decisions.

SAP and other SAP products and services mentioned herein as well as their respective logos are trademarks or registered trademarks of SAP SE (or an SAP affiliate company) in Germany and other countries. All other product
and service names mentioned are the trademarks of their respective companies. See http://www.sap.com/corporate-en/legal/copyright/index.epx for additional trademark information and notices.