Skip to Content
Author's profile photo Jerry Wang

An useful Chrome extension – UI5 Inspector

There is a useful Chrome Extension for UI5 which could be downloaded via url:

/wp-content/uploads/2015/12/clipboard1_854730.png

Once installed, there will be a new tab “UI5” in Chrome development tool.

Within this tab, instead of displaying the native HTML dom elements in traditional “Elements” tab, it will display UI5 controls together with their properties. See the navigation back button for example.

/wp-content/uploads/2015/12/clipboard2_854731.png


Compare with the original property display for this navigation button:

/wp-content/uploads/2015/12/clipboard3_854780.png

Through comparison we can easily find out that the Chrome extension provides us a more neat view which can help us concentrate on those UI5 properties.

In the Bindings tab, there are more detail information regarding a control if it is bound to a given model field, for example the binding path, the current value of the model field, the field type and model type, as displayed below:

/wp-content/uploads/2015/12/clipboard4_854781.png

The Application Information tab contains general information of current UI5 application, so it is not necessary for you to press Ctrl+Alt+Shift+P to get this information displayed.

/wp-content/uploads/2015/12/clipboard5_854782.png

Assigned tags

      4 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Jitendra Kansal
      Jitendra Kansal

      Jerry Wang

      URL is pointing to internal SAP system that cant be accessed from outside network.

      This should be the right one.

      UI5 Inspector - Chrome Web Store

      Regards,

      JK

      Author's profile photo Jerry Wang
      Jerry Wang
      Blog Post Author

      Hello JK,


      Thanks a lot for your correction, I have changed the link 🙂

      Best regards,

      Jerry

      Author's profile photo Former Member
      Former Member

      Hi Jerry,

      When I am trying to access the addon to my UI5 application on chrome browser its throwing this error. Could you please resolve it.

      1.PNG

      Author's profile photo Michael Appleby
      Michael Appleby

      Please create a new Discussion marked as a Question.  The Comments section of a Blog (or Document) is not the right vehicle for asking questions as the results are not easily searchable.  Once your issue is solved, a Discussion with the solution (and marked with Correct Answer) makes the results visible to others experiencing a similar problem.  If a blog or document is related, put in a link.

      NOTE: Getting the link is easy enough for both the author and Blog.  Simply MouseOver the item, Right Click, and select Copy Shortcut.  Paste it into your Discussion.  You can also click on the url after pasting.  Click on the A to expand the options and select T (on the right) to Auto-Title the url.

      Thanks, Mike (Moderator)

      SAP Technology RIG