Debugging dynamic scripts injected into CRM Ribbon

If you need to debug javascript code thats invoked via the ribbon and the javascript is getting injected dynamically into the page, then you need a way to stop at a breakpoint.

One thing you can do is add a line at the top of your script with the following code:
debbugger;

This will cause the debugger to stop at that line and you can then work your way through the file.

But an even cooler way to do it (when using Google Chrome) is to add the following line at the very bottom:

//# sourceURL=dynamicScript.js

Now, when the code gets injected into Chrome, you will find it in the “Sources” tab.

Notes:
You can name the file anything, and so if you have multiple points of injection, you can name each one differently.
Your breakpoints are preserved across reloads of the page (which is unlike using the debugger statement).
You need to look under the (no domain) header for the file.

And when using the log, use this function:

function logToConsole(message) { if (typeof console != 'undefined') { console.log(message); } }

Note: the reason I dont override log function is because I want to play nice with other JS scripts that maybe getting loaded within CRM. You need to use this especially in IE, as when the debugger is not shown, the console object can be null.