Bootstrapping ushell_abap for variant persistence

I have a FIORI application (lunched from launchpad) in which I am using unified shell to persist variants.

In my index.html, I first bootstrap the ushell_abap and then ui bootstrap like this

<script id="sap-ushell-bootstrap" src="https://sapui5.hana.ondemand.com/1.90.0/resources/sap/ushell_abap/bootstrap/abap.js"></script>

<script id="sap-ui-bootstrap" src="https://sapui5.hana.ondemand.com/1.90.0/resources/sap-ui-core.js"
    data-sap-ui-libs="sap.ushell, sap.collaboration, sap.m, sap.ui.layout, sap.ui.ux3"
    data-sap-ui-theme="sap_belize" 
    data-sap-ui-resourceroots='{"cvg.wallapp": "./"}' 
    data-sap-ui-compatVersion="edge" 
    data-sap-ui-async="true" 
    data-sap-ui-frameOptions="trusted"
    data-sap-ui-bindingSyntax="complex"
    data-sap-ui-oninit="module:sap/ui/core/ComponentSupport">
</script>

My app works fine, including variant persistence when running in localhost.

I now deploy the APP to my Fiori server and the bootstrapping process falls apart. It completely fails to load my theme and associated styling (no custom styling just using the belize theme).

In the console I get the following errors:

includeStylesheet-dbg.js:77 GET https://xxxx:yyyy/sap/public/bc/themes/~client-810/~cache-Bo-MdJE9H9k-CMXXsBrbgsL9ZXQ/UI5/sap/suite/ui/commons/themes/Fiori_LP_Home_Theme/library.css net::ERR_ABORTED 404 (Not found)

One or more parameters could not be found. - sap.ui.core.theming.Parameters

As soon as I remove the bootstrapping of ushell_abap everything works (except the persistence of variants of course).

I have exhausted google searches and reading through the ushell documentation here https://sapui5.hana.ondemand.com/sdk/#/api/sap.ushell

Anyone with an idea on why bootstrapping is failing when truing to use ushell_abap ?

Solution

The main issue here was that the app was using a different version of the css libraries than the bootstrap libraries which caused errors (in this case core had new elements in css styling not available in the old css library for core).

If your APP is set up as a standalone APP as explained by Benedikt Kromer and you bootstrap to a specific sapui5 version in the index.html, you can force the app to use the same version css libraries by applying the style to the core on init of the main app.

In on init I just added:

sap.ui.getCore().applyTheme("sap_belize");

This forced the app to load css libraries from the same version I used to bootstrap.

You can see this by watching the network tab in developer tools.