Skip to Content
Technical Articles

Fiori Launchpad Plugin / Extension with HeaderItem disappears – Solution and configuration options

Problem

Buttons added by custom Fiori plugins / Extensions to the Fiori Shell header disappear after opening a Fiori app. This behavior starts from SAPUI5 version 1.60.xx (part of FES 5.0). On lower versions like 1.52.xx , this wasn’t a problem and the buttons were always visible.

This behavior happens independent from the way you configure the plugin, using target mappings or global config.

Depending on the use case, Fiori plugin header buttons should not be visible in each app but at least always on the home page. With this solution it’s possible to show the button only (and always) on the homepage and/or in apps.

Let me show you how to reproduce this bug and how to solve it.

Reproduce

Generate a Fiori Launchpad Plugin in SAP Web IDE for an ABAP environment with the latest UI5 version

Provide a name for the plugin

Add a namespace and select “Add button to launchpad header”. This will provide sample code that causes the issue!

Change the run configuration to test the plugin

Add configuration for “Run as SAP Fiori Launchpad Sandbox”

Select “/fioriSandboxConfig.json” as the “File Name” to run the app:

Set “#Shell-home” as URL Hash Fragment:

Running the sandbox launchpad with the generated plug will show an additional button in the shell header. This button will disappear as soon as you navigate to an app, which could be acceptable. When you navigate back to the Fiori Launchpad, the button of the plugin is not coming back… this is not that nice…

This behavior is caused by the code that that adds the button header, it’s using the wrong parameters.

Solution

Based on the API documentation, it’s possible to change the behavior: https://ui5.sap.com/#/api/sap.ushell.renderers.fiori2.Renderer/methods/addHeaderItem

The button will be always visible on the home page of the Fiori Launchpad by changing the code to the following example:

The result looks like this:

The following code will show the plugin button always (on the home page and in the apps):

Or simply like this (will have exactly the same behavior):

Result:

2 Comments
You must be Logged on to comment or reply to a post.