Like the Dinosaur if we don’t continually learn and adapt we run the risk of becoming extinct. For most of my career I have always used the IE debugger for JavaScript despite knowing that Chrome DevTools was far better with richer features and generally quicker to use.

Why?

Guess I had a reluctance to move away from that which is familiar to me as JavaScript development has never been my favorite language though times are starting to change! I have made the move now to Chrome not only because the debugger is much nicer but for CRM there a number of great Chrome extensions to help increase my productivity and I never liked having to switch across different browsers just to develop in CRM. Every browser has its own nuances especially when working with Dynamics 365 so the less browsers I have to use the better!!.

Chrome Debugger Broken

Unfortunately, I was caught out by an issue recently which frustrated my adoption of it. I’m unsure of the cause is down to CRM, Chrome or a combination but when trying to debug some code Chrome would not highlight the line both when it went to the break point and afterwards when trying to step through the code. It only happened when I included this line within a HTML web resource.

<script src="ClientGlobalContext.js.aspx" type="text/javascript"></script>

Yet the IE debugger worked fine and as expected (makes a change!).

Here is what it looked like!

Not working the code line is not highlighted

Then we remove the JS include and everything is fine:

Current line is highlighted in Chrome debugger

Ar first I thought a workaround was to place the code in a separate JS file. That works fine for when calling functions in that library but if the web resource has JS code within it too that you need to step-through you are out of luck my friend. At time of writing I don’t have an older VM available to test but I am sure this issue only occurs in the following scenario:

D365 Online v9.1.0.9228 + Chrome (v77.0.3865.90) + HMTL Web Resource and trying to include the Global Context library.

Otherwise how would anyone be able to debug there web resource code using Chrome if the JavaScript is inline with the HTML? Then the light bulb moment finally arrived… it would be highly unlikely in a real world scenario that it would be done this way in first place! If you look at the SDK samples (E.g. JavaScriptRESTDataOperations) the HTML web resource has no inline script it is all done via other libraries namely

  • SDK.REST.js
  • JavaScriptRESTDataOperationsSample.js

Plus, now that I come to think about it I have always avoided inline JS code where possible and favored reusable / encapsulated code within appropriate libraries.

What’s the lesson

I have spent a serious amount of time trying to understand a problem, that is highly unlikely to ever actually be a damn problem in the first place. Well done me! Take a bow Antony Grrr.