JSLint.VS2010: Automatic JavaScript Static Analysis

Recently, I was working on a project that used some asynchronous JSON-to-HTML databiding. Testers sent a bug that the site was working in Chrome, Firefox, Safari and IE9 but nothing was happening in IE8. The IE8 javascript debugger didn’t report any errors, it just didn’t do anything.

This sort of thing is no fun to debug and I spent an increasingly desperate evening staring at code that couldn’t possibly be wrong  failing to see the problem. Eventually, in desperation, I pasted the code into Douglas Crockford’s jslint and it quickly pointed out a stray comma which made all the difference.

I later discovered that there is a jslint extension available for Visual Studio 2010.

The really cool thing about the JSLint Visual Studio extension is that it reports its warnings and errors into the Visual Studio Error List window where they work just like other code errors. Even better, it has the option to cancel the build on error. That means if jslint finds an error, the project build dies. In my world, this is fantastic. It means I don’t even try to test something if jslint finds something wrong with it. I consider this to be a huge productivity win.

The following JSLint global options were key for me to use jslint as a build-time checker:

• Output: Errors – causes Visual Studio to interpret JSLint output as errors
• Run JSLint on build: true – causes JSLint to test all .JS files during build
• Cancel build on error true– causes JSLint errors to cancel the build, just like C# compiler errors
• Assume a browser: true
• Predefined Vars: jQuery, $
• Strict whitespace: false
• Maximum line length: 999

One issue with cancelling the build on error is that jslint is pedantic and some of its warnings are not strictly errors which means that standard libraries like jquery aren’t going to pass jslint. Fortunately, you can exclude individual .js files from build-time testing by right-clicking on the files you want to exclude in the Solution Explorer window. (Note that jslint doesn’t plug its menus into the Solution Navigator window from the “Productivity Power Tools” extension. You have to use the Solution Explorer.)

Happy linting.