Skip to Content

Great tool for debugging UI5


Some of you might have tried to extend a standard fiori app. It is quite tedious to figure out which view and control to enhance sometimes. The way I did it was to use the chrome web debugger and inspect the source and find the correct control. This way it knew what to change in the view I needed to replace.

This might not be new for some of you, but it was for me. So I thought I might as well share it with all of you, just in case. SAP has released a new tool for chrome to easier debug a UI5 application. It let’s you inspect the SAPUI5 controls in a given app.

The tools adds a new tab to the debugger specifically designed for UI5 applications. You can use this to highlight the controls viewed on the page, when you hover over a control.

09-11-2015 15-38-43.png

Also you can change the controls directly in the debugger without having to rerender the code.

09-11-2015 15-39-21.png

One last great this is that you can also see the bindings of the control directly in the debugger.

09-11-2015 15-39-26.png

Go check out this new tool here and download it in the Chrome web store

I was pretty excited to see this. How about you?

You must be Logged on to comment or reply to a post.
  • Hi Jakob,

    I have added the UI5 Inspector plugin but when i am opening debugger session (F12) post running fiori application, i am getting below screen. Any idea what could be the reason?

    There is no OpenUI5/SAPUI5 found on this page


    Amit Srivastava