Skip to Content
Author's profile photo Daniel Vladinov

UI5ers Buzz #17: Support Assistant – Keep your UI5 Apps in Good Shape!

Have you ever imagined a world in which your SAPUI5/OpenUI5 dev/test environment will help you fix UI issues before they are even discovered? Well, this is not fiction anymore. With the UI5 Support Assistant you can easily and efficiently check whether your apps are following the UI5 best practicesproduct standard requirements or SAP Fiori Design Guidelines.

Picture 1: Support Assistant tool in use

SAPUI5 is the strategic technology to move towards appealing and standard-compliant web designs and Fiori apps, based on this UI5 framework, have become the mainstream for S/4 HANA. However, with experience we’ve come to realize that the guidelines and best practices, although documented, are not widely known or followed by all stakeholders and development teams. Also, it is a familiar fact that consultation tickets, software bugs or performance issues are often more costly and difficult to resolve when discovered late. So, we started thinking how we can ensure that guidelines are being followed correctly and at the same time help speed up the development process and reduce costs. In other words, how we can make life easier.

The solution was the development and release of the latest support tool – the Support Assistant, which became available as of SAPUI5/OpenUI5 version 1.48. It is embedded in the SAPUI5 framework and allows you to check directly in the browser runtime whether an existing or newly developed Fiori or freestyle app follows UI5 best practices, product standard requirements or SAP Fiori Design Guidelines.

The tool is easy to start. You can either use the URL parameter sap-ui-support=true or open it from the Technical Information Dialog using the key combination ALT+CTRL+SHFT+P. You can find more information in the Support Assistant Documentation.

Picture 2: Activating the Support Assistant

You are probably wondering if you need to be using a new SAPUI5 version to be able to take advantage of this tool. The answer is: No. The Support Assistant is designed to run in a separate instance side-by-side with the UI5 app and to appear in a separate frame, so it can be used to analyze any SAPUI5-based application down to version 1.44.17.

So, how exactly does the Support Assistant work?

It’s a tool, based on rules. Their main idea is to turn human knowledge and expertise into machine readable and executable format. They check for known or expected issues and provide links to the exact documentation pages where solutions are explained. Support rules are very easy to be authored and tested directly over the running application. A handy API to explore UI5 elements or console logs and traces is provided for the rules JavaScript check() function. They help you prevent early in the development process common programming and runtime mistakes that may affect performanceusability, consistencyaccessibility or functionality of your UI5 app. Just select the Rules, click ‘Analyze’ and check the Issues detected. Easy-peasy, right!

Picture 3: Support Assistant Rules

So, if you are still wondering why the Support Assistant should be your go-to, here are just a few of its many benefits:

  • It helps you reveal potential issues and ensure best practices and design guidelines are followed.
  • It can automatically check for specific re-occurring or expected UI issues and suggest on-the-spot solutions and documentation links.
  • It helps to lower development and maintenance cost for SAP internally and for customers.
  • It makes the development process faster and more efficient by providing help and support at the right time.

Stay tuned for more posts about the Support Assistant in which we’ll give you more information about the support rules and about specific features of the tool.

The next post of our UI5ers Buzz blog series will cover “Useful Tools for developing UI5 with WebStorm”.

How are we doing? Let us know by leaving a comment here or contacting us in the slack channel.

Previous Post: UI5ers Buzz #16

Talk to you soon,
Daniel Vladinov


Daniel Vladinov is a Product Owner at SAP with 13+ years of experience in the company. Member of the UI5 (HTML/JS UI library created by SAP) development unit in Sofia. Strongly focused on UI5 supportability tools.

Assigned tags

      9 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Mike Doyle
      Mike Doyle

      Thanks for the info Daniel.  It's great that the tool supports versions down to 1.44, as that is the stable/maintenance release for the 'Fiori 2' design.

      I assume it's been tested with a SAP Cloud Platform portal service FLP?  I just did a test with a site on Maintenance 1.44.  When I open the ALT+CTRL+SHFT+P dialog I can see that we are running 1.44.19 and the Activate Support Assistant button appears.  When I click it nothing happens and I get the following in the console: Support Assistant could not be loaded from the URL you entered

      I tried with the url parameter too and the result was the same.

       

       

      Author's profile photo Daniel Vladinov
      Daniel Vladinov
      Blog Post Author

      Hi, Mike

      Yes, the Support Assistant should be functional after 1.44.17 and is also tested / working with FLP. In fact - with any SAPUI5-based application.
      We've also seen some situations when it doesn't load properly. Depending on the FLP/Cloud hosting settings, it might be cross-domain rules loading issues (see architecture), e.g. there is “Content Security Policy” set on application level and the Support Assistant cannot be loaded. setup;

      Would you open browser's dev tools (F12) and observe in the Network/Console logs for errors?

      Kind Regards, Daniel

      Author's profile photo branislav popadic
      branislav popadic

      Same here, tested on version 1.48.6, 1.48.11, console shows error: "Support Assistant could not be loaded from the URL you entered"

      Author's profile photo Diether De Coninck
      Diether De Coninck

      Same here. And workaround from below makes no difference..

      Author's profile photo Diether De Coninck
      Diether De Coninck

      My Error is

      HEAD https://flpnwc-site/myapp/sap/ui5/1/resources/sap/ui/support/Bootstrap.js 404 (Not Found)
      window.XMLHttpRequest.send @ jquery.sap.trace-dbg.js:124
      X.send @ xhr-dbg.js:516
      send @ jquery-dbg.js:9203
      ajax @ jquery-dbg.js:8684
      q.ajax @ jquery.sap.global-dbg.js:1697
      _loadAssistant @ TechnicalInfo.js?eval:6
      _startAssistant @ TechnicalInfo.js?eval:6
      onOpenAssistant @ TechnicalInfo.js?eval:6
      a.fireEvent @ EventProvider-dbg.js:229
      a.fireEvent @ Element-dbg.js:593
      (anonymous) @ ManagedObjectMetadata-dbg.js:426
      B.ontap @ Button-dbg.js:239
      a._handleEvent @ Element-dbg.js:301
      U._handleEvent @ UIArea-dbg.js:786
      dispatch @ jquery-dbg.js:4737
      g @ jquery-mobile-custom-dbg.js:1972
      p @ jquery-mobile-custom-dbg.js:2050
      dispatch @ jquery-dbg.js:4737
      c3.handle @ jquery-dbg.js:4549
      trigger @ jquery-dbg.js:7819
      (anonymous) @ jquery-dbg.js:7903
      each @ jquery-dbg.js:365
      each @ jquery-dbg.js:137
      trigger @ jquery-dbg.js:7902
      P @ jquery-mobile-custom-dbg.js:1543
      R @ jquery-mobile-custom-dbg.js:1553
      dispatch @ jquery-dbg.js:4737
      c3.handle @ jquery-dbg.js:4549
      16:55:54.813 jquery.sap.global-dbg.js:999 2017-11-15 16:55:54.752909 Support Assistant could not be loaded from the URL you entered

      Author's profile photo branislav popadic
      branislav popadic

      I found the solution for my problem, when you press Ctrl + Shift + Alt + P, and you are using resource from CDN, in dialog you have to go to settings, and from Reccomended locations choose SAPUI5 CDN, and then click Activate Support Assistant.

      That should do it.

      Notice also options setting to open SA in new window.

       

      Author's profile photo Chris Neve
      Chris Neve

      Really exciting tool! Wish it'd been around a few months ago 🙂

       

      Author's profile photo Christopher Solomon
      Christopher Solomon

      Just started using it. Pretty cool. Let's see where it goes from here!

      (*any way to totally deactivate it? ie. you don't want some clever user running it in production?)

      Author's profile photo Daniel Vladinov
      Daniel Vladinov
      Blog Post Author

      Hi Christopher,

      thank you for the interest exploring it - would be glad to know your feedback.

      As for deactivation - there is no such feature currently, but your question had triggered me, so we would consider it in future.