Debugger to the rescue for global js files – IP2015

Guess what, I am working on OpenUI again and it feels really good. I recently, got an opportunity to work on IP 2015 and developing some really cool functionalities (Favorites, Broadcast Message Bar etc) as part of project.

A lot of things have changed as compared to 8.1.1.11, PM’s & PR’s have become more structured. Themes have moved in to manifest but with all the good things comes the complexity. We all know that we can have our custom js file included at the application level by copying the “PLATFORM INDEPENDENT” manifest entry and linking our custom js file. This comes in really handy when you are trying to work functionalities that are global in nature (Application level tooltips, anyone ??).

Let me clarify, I know this is not a new feature but when you did that in earlier versions you would see your file included in the sources tab of the browser

sources_1

This comes in really handy to debug and verify your changes have taken effect, change and test code on the fly. Also in case there were errors in your code it would show in console what the error is and what is causing that error.

But, it seems that in IP2015 (may be IP2014 also) due to core framework changes the global level JS inclusions just don’t show up in Sources tabs (it took me several hours to find this out).  To make matters worse in case if your code has errors then all you get is error shown below

sources

Error in downloading file require:null

It seems that Siebel OpenUI framework handles even the syntax errors of all the global files and then shows a generic message. This means the only way to debug is to either use alert or log (SiebelJS.Log or console.log) statements at each at every line to find out where the problem is.

Don’t fret, there is an easy way out and that is the debugger statement. Just write the “debugger” statement in your code where you would like to set a break point and open browser console and clear the cache.

debugger

This debugger statement acts as debug point but the difference is that it is only takes effect when browser console is open. So, instead of using sources tab of browser to set break point you can do it right from your code.debugger_in_effect

This is what happens as soon as debugger statement is encountered. I hope this tip helps somebody save hours worth of effort.

I know I have been pretty inactive but time to get active again. Lot more in store keep reading.

This Post has been viewed : 3,232 Times


6 Responses to Debugger to the rescue for global js files – IP2015

  1. Welcome back Neel!!!

    I too faced the same issue when I wrote a custom post load javascript but it used to never show up under the Sources tab and I was thinking that the file was not getting downloaded to my browser cache. Then I started adding console.log statements which showed up on the console which made me realize that my custom file was actually being invoked. I was using that so far to debug. Thank you for letting me know about the debugger.

    • @lex,

      Working on siebelhub library these days, ti has helped me with some really tricky requirements but I think it can remolded differently to become a part of OpenUI framework rather than be stand alone custom library.

      Will post the idea I am working on soon. Thanks for making it open source 🙂

  2. Welcome back Neel,
    Always followed you post. working on my second IP2015 project and sure would try this option now as it is pretty straight forward.

Leave a Reply

Contribute