How-to series: Easily debug your CRM JavaScript code in IE8

Well, as a lot of you may know it, you can put your own JavaScript code in the forms or fields events (OnChange, OnLoad & OnSave events).

But, did you know that you could debug your JS code just by using IE8 and the Developer Tools?

These tools are available by hitting the F12 button when you are browsing a web page, and they offer the following functionalities:

  • debug HTML & CSS
  • debug scripts
  • inspect HTML elements & CSS properties
  • etc.

http://msdn.microsoft.com/en-us/library/dd565622(v=VS.85).aspx

Recently, I was trying to figure out why one of my SOAP request wasn’t working properly (it was working but…was not totally working :-) )

To be able to debug your JS code, you have to follow these steps:

  1. Enable script debugging in the IE8 options

    image

  2. On the form you want to debug, hit the F12 key to enable the Developer Toolbar, and navigate to the Script tab

    image

  3. Hit the Start Debugging button and select the line where you want to start debugging (a red dot will appear and the selected line will be highlighted in red) to place a breakpoint 

    image

  4. Do whatever you want to do on your CRM form (in my case, I want to retrieve the contact information from a lookup field), and if the breakpoint is reached, your action will be in “pause” (meaning: every time you will “step” in your code [by hitting the F10 key], the lines will be highlighted in yellow)

     image

  5. If an error is found, you’ll end up in a catch where the error will be displayed

image

In my case, the error was not coming from the OSOC_CONCERNINGID field which was correctly set, but from the ADDRESS1_CITY field which was null on the contact form!

As you can see, it is always good to test your JS code before going to production because the error messages are not so easy to understand, and it is sometimes very hard to pinpoint the line that is causing a mayhem :-)

One thought on “How-to series: Easily debug your CRM JavaScript code in IE8”

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>