Fiori Approve All app rendering issue

[bradp]

Hi,

I have a strange issue with the the Fiori Approve All app (ui5_ca_all_apv) when rendering in any desktop browser. I have tried IE9, Chrome and Firefox. What happens is it doesn't seem to load the css properly. The UI5 runtime on the system is 1.22.2

On first load I usually get the following:

Then after refreshing any number of times, sometimes once sometimes 10 times or more, I eventually get it to load.

However when running it through Ripple, a mobile emulator plugin for chrome, it always works first time.

I have looked at the console logs in all browsers, and there are no errors reported in any browser.

I have tried a few other Fiori apps, most work but there are a few others which behave the same.

This is also not specific to my desktop as this is also happening for other users.

Anyone using this app already and had similar issues?

Any help would be appreciated.

Thanks,

Brad

Tags edited by: Michael Appleby

[former_member182874 · Accepted solution]

Hi Brad,

You can upgrade to 1.22.3 and try. There are some fixes done. :

• [FIX] Custom theming: missing base.less (github issue 42)
• [FIX] ODataModel: Use null literal in filter expressions
• [FIX] ResourceHandler: workaround for IE issue EOT files and Vary header
• [FIX] core.BusyIndicator: Position at Top and Use CSS Animation
• 
  

Others

• [FIX] Demokit: correct links from dev guide to API reference
• [FIX] Don't omit IE9 specific CSS files from 'static' packages
• [FIX] sap.m.FeedInput: css fix because of change for button truncation
• [FIX] sap.m.StandardListItem with iconInset: layout is wrong in IE9
• [FIX] sap.m.ToggleButton: text truncation fix for the different browsers - css style classes for toggle button adapted
• 
  

May be you can upgrade to 1.22.6 in incremental manner and check.

Check this link for all the fixes done in UI version upgrades. :

SAPUI5 SDK - Demo Kit

Regards,

Tejas

[bradp · Accepted solution]

Hi Tejas,

Thanks for your response, see my answer to Masa above, I found a solution.

I had already upgraded the UI5 runtime to 1.22.8 and that did not fix it.

It appeared to be trying to load gold reflection theme, so by passing the theme in the URL as a parameter like &sap-theme=sap_bluecrystal - the isue seems to be fixed.

Cheers,

Brad

[masa_139 · Accepted solution]

Hi Brad,

I think you use old app "ui5_ca_all_apv". Please use new app "ca_all_apv".

Important Note: Please use new UI with new SAP Fiori launchpad

Regards, Masa

SAP Customer Experience Group - CEG

[bradp · Accepted solution]

Hi Masa,

You are correct, I was trying to access ui5_ca_all_apv. I will switch to ca_all_apv.

Thanks,

Brad

[masa_139]

Hi Brad,

Please take a look .

UIX01CA1 SP02 and SAPUI5 1.22.5 are available.

If you use custom theme, you should rebuild it.

Regards, Masa

SAP Customer Experience Group - CEG

[bradp]

Hi Masa,

Thanks for the quick response. We are on UIX01CA1 SP02 at the moment.

I will get the system upgraded to a later SAPUI5 runtime version. Hopefully that will fix the issue.

Will update this thread once done.

Thanks,

Brad

[bradp]

Hi Masa,

I have applied all the notes, upgrade UI5( even upgraded everything upto 1.22.8) And I ran all those transactions and reports to clear the cache. I also cleared the local cache and even tried it on a new machine.

Unfortunately I'm still experiencing the same problem.

Cheers,

Brad

[masa_139]

Hi Brad,

Do you use custom theme or default blue crystal theme?

Please check the css load and time in inspect element.

Regards, Masa

SAP Customer Experience Group - CEG

[bradp]

Hi Masa,

I'm not using a custom theme, just the default theme, which is supposed to be blue crystal however on failed attempts to load, it appears to try and load gold reflection.

See this screenshot when it fails to load:

And after refreshing a few times it successfully loads and shows the blue crystal theme. see below:

Which made me think about passing the theme in as part of the url using this parameter: &sap-theme=sap_bluecrystal

This seems to fix the problem and it loads perfectly first time everytime now.

However, is this a proper solution? Should you need to pass the theme through the URL, is it not defined within application ui5_ca_all_apv?

I took a look at the code for the ui5_ca_all_apv where it supposedly sets the theme to sap_bluecrystal:

// startup shell before UI5
  var oScript = sap.ca.common.uilib.bootstrap.createScriptTag("/sap/public/bc/ui2/shell-api/sap/ui2/shell/shell.js");
  oHead.appendChild(oScript);
  var bDebugMode = /sap-ui-debug=(true|x|X)/.test(window.location.search);
  //Check local storage (modified via UI5 technical info dialog)
 try { //Necessary for FF when Cookies are deactivated
        bDebugMode = bDebugMode || (window.localStorage.getItem("sap-ui-debug") == "X");
} catch(e) {}


  var sUI5Url = "resources/sap-ui-core" + (bDebugMode ? "-dbg" : "") +  ".js";
  var oScript = sap.ca.common.uilib.bootstrap.createScriptTag(sUI5Url);
  oScript.id="sap-ui-bootstrap";
  var sUilibs = "sap.m, ";
  if (!sap.ca.common.uilib.bootstrap.applicationSettings.bNoSapMe){
  sUilibs = sUilibs + "sap.me, "
  }
  sUilibs = sUilibs + "sap.ui.commons, sap.ca.common.uilib";
  oScript.setAttribute("data-sap-ui-libs", sUilibs);
  oScript.setAttribute("data-sap-ui-theme", "sap_bluecrystal");
  oScript.setAttribute("data-sap-ui-xx-bindingSyntax", "complex");
  oScript.setAttribute("data-sap-ui-oninit", "sap.ca.common.uilib.bootstrap.onUI5Init();");
  oHead.appendChild(oScript);

Do you think this is a bug? Or should I just go with setting the theme as a URL parameter?

Thanks for your help!

Cheers,

Brad