I’m preparing another (hopefully) useful full length article, but in the mean time I want to share with you a trick for getting a world-class debugger for free in IE.
JavaScript debugging in Visual Web Developer Express
Some background: users of Visual Studio have long known that it comes with an awesome debugger, probably the best JavaScript debugger there is (though Firebug is catching up fast). Whenever you get a JavaScript error, Visual Studio can connect to the Internet Explorer process and start debugging. You can pause the execution of the code, rewind and fast-forward execution, modify data held in variables and get notified when specific variables change in value. Once you’re used to it, coding without a debugger makes you feel like a blind man in a dark room looking for a black cat that isn’t there*.
The only problem is that it costs upwards of £500. Microsoft have released an excellent free edition of Visual Studio for web development called Visual Studio Express, but among the features reserved for the professional edition is the ability to connect to a process. Hence when you get a JavaScript error in a web page, VSE won’t appear in the list of possible debuggers.
The work-around is to get VSE to launch IE for you, so that it owns the process and doesn’t have to explicitly connect to it.
This article was originally written for an older version of Visual Studio Express called Visual Web Developer Express. The instructions should still work, let me know if you have any issues with them.
Step 1
Internet Explorer Options
First enable debugging in IE: go to Tools > Internet Options > Advanced, and make sure “Disable Script Debugging (Internet Explorer)” is unchecked and “Display a notification about every script error” is checked.
Step 2
Then Download and install VSE
Step 3
Creating a new empty website in VWD express
Create a new empty website
Step 4
Click the “Start Debugging” button. You will be prompted to enable debugging for this website – do so. VSE will then launch IE in debugging mode.Since your website is empty you will see a 404; ignore it and navigate to the actual page or website you want to debug.
Debugging tips
Any script errors will cause IE to pause execution and transfer control to VSE. The screenshot to the left shows me changing the value of a variable as the script is paused.
If any Firefox users have problems getting VSE to launch IE, see James Wiltshire’s comment below.
A few debugging tips:
- Learn these shortcuts: Step Over (F10) executes the current line of code and moves to the next one. If the current line of code contains a function call, Step Into (F11) moves the debugger into that function call. Step Out (Shift+F11) executes the rest of the current function and pauses again after it returns. Continue (F5) resumes the script until the next error or breakpoint.
- Debugging is easier if you write code with one function call per line, so that the debugger knows which function you want to step in to.
- You can type any expression in the Watch window, and when its value changes it will turn red.
- If you want to open the debugger when there is no error, click in the left-hand margin to set a break point or place the ‘debugger’ keyword in your code (this works in Firebug too).
- The Script Explorer window is an extremely useful list of open JavaScript and HTML files that you can use to find code in order to set a breakpoint. It is not shown by default but you can enable it in Debug > Windows > Script Explorer.
- A tip from Fraser in the comments below: If you like, you can create a home page for the new site, and add this code to the head section: <meta http-equiv=”refresh” content=”0;url=http://yoursite.com”>. This will redirect you automatically to your chosen site.
Happy coding!
* joke stolen from Rowan Atkinson
Bernie,
As we say here in America…You the man!
Thanks a million for this tip. After installing Visual Web Developer, it took me about 15 minutes to fix a problem that otherwise could have taken me a week to find.
Firebug (lite) in IE:
http://getfirebug.com/lite.html
Cheers!
I’ve been using VWD for a while and it seemed great. Then suddenly it starts to crash and a full install (150GB) is required to fix it. I’m now moving back to Firebug and the Opera debugger – virtually the same debugging features, they don’t get corrupted and no massive downloads to set them up!
VWD is very disappointing after an encouraging start.
you made my day :-)
Pingback: Numiko Labs » JavaScript Debugging
This tut made my day :)
I was looking for a decent way to debug in this crappy MSIE and now found this way which certainly gives firebug feeling :D
Thanks for this post :D
x
x
madafakerimpresarionte
as other posters have said, you’ve definitely made my day. thank you for taking the time to share!
Pingback: how to achieve a cross browser compatible webdesign ? - Page 2 - x10Hosting Forums
Pingback: Web开发工具大集合——每个浏览器都有份的！ | 网生代
Hi Bernie,
Following your advise I downloaded VWD and am using it to debug my JScript. However it wants me to register. When I press the Register button it connects to a register web-site, then fails. I tried to talk to our local Microsoft offices and once I got through with much button-pressing met only ignorance and arrogance. I need VWD but can’t register – any suggestions would be very very welcome.
Привет! Мы предлогаем аренда квартиры в Москве без комиссии!
Звоните, все расскажут и покажут. Большой выбор квартир на сайте :)
Thanks for the handy write-up! This is a life-saver.
Thanks, great for fixing those anoying IE only Javascript bugs.
Pingback: Visual Web Developer 2008 Express Edition « Techie Note
Pingback: Need help about javascript - x10Hosting Forums
Dude you rock.
Great tip.
Thanks. I’m happy with ExeScript PRO JavaScript Dedugger.
Watch One Piece Episode 346 Online!
I tried but it opens IE debugger.
Howcan i debugg in Web developer 2008
Hi
I want to ask how we can put an email or button in visual web developer 2008 for users to send an email for the owner, if they want to ask about any things..
I think it is a code we put it in the submit/send button !!
Thank you for posting this. Everything is better than “Object error” popups.
Thank you!!! I just spent 4 hours looking through code trying to figure out a JS error that was happening in IE and not in Firefox…this solved it in 2 seconds!!
Pingback: Firefox to IE Help - x10Hosting Community
The lionized buy viagra online is an vocal panacea toughened for treating masculine impotence (e.g., erectile dysfunction). Viagra’s advantages are a prodigious safeness wake trace distance and proven side effects. The effect of Viagra starts in 30 minutes to 1 hour and lasts allowing for regarding approximately 4 hours.