Microsoft Updates Visual Studio JavaScript Tools

Microsoft has added new tooling support for JavaScript in Visual Studio 11.

In a recent blog post, Jason Zander, Microsoft’s corporate vice president for the Visual Studio team said Microsoft has added a slew of improvements to Visual Studio 11 to make things easier and better for JavaScript developers.

Windows 8 support

Visual Studio 11 is the next major version of Microsoft’s flagship application development platform that will support development on Windows 8.

“The first thing you’ll notice when doing JavaScript development in Visual Studio 11 is IntelliSense,” Zander said. “After using it, you might forget that you’re working in a dynamic language! The JavaScript editor has been completely rewritten on top of the same Chakra runtime that ships in IE10, which means that IntelliSense is more responsive, accurate and scalable than ever before.”

IntelliSense is Microsoft’s implementation of autocompletion. In addition to completing the symbol names the programmer is typing, IntelliSense serves as documentation and disambiguation for variable names, functions and methods using reflection.

Meanwhile, the Visual Studio 11 JavaScript editor has been designed to recognise and support third-party JavaScript libraries so that developers get a “native-like” experience when consuming their APIs. JavaScript is known for its many libraries and reusable components such as jQuery and others.

However, Zander said, “Despite how accurate IntelliSense is, JavaScript is ultimately a dynamic language. Therefore, there are still times when the value of an object is too ambiguous for the editor to know what you expect to see when accessing it. For those instances, you can provide ‘hints,’ in the form of XML doc comments, which explicitly declare your completion list expectations. This feature has been in Visual Studio for a few releases, and has been enhanced in Visual Studio 11 to make it easier to use. One neat enhancement is the ability to annotate the value of an object, as opposed to its type (constructor function). Simply provide an example of what the object’s value could be and IntelliSense will take care of the rest. This allows you to define an IntelliSense-only ‘type’ without having to modify your existing API.”

Debugging improvements

Microsoft also has improved the JavaScript debugging experience in Visual Studio 11, with two new tool windows: DOM Explorer and JavaScript Console. Both of these windows help you understand the browser’s interpretation of your app and perform quick and iterative updates without having to interrupt your debugging session, Zander said, noting that the new JavaScript debugging support “saved” him a couple of times.

The Visual Studio 11 platform is designed to support the development of both web and Windows 8 Metro-style apps. According to Microsoft, “Metro style apps are designed to be full screen, beautiful, connected to the people and content you care about, interactive and touch-first, and work in a variety of layouts and form factors.”

Yet, “regardless whether you’re developing a web app or a Metro-style app, you’re writing your UI in HTML and CSS,” Zander said. “Trying to visualise a given page’s DOM, as well as the exact CSS properties needed to style it in the way you want, can become a daunting task for any nontrivial application. With the DOM Explorer, you can easily find an element in the DOM tree (by clicking the Select Element button), view the CSS properties that are applied to it, and tweak them on the fly. I’ve found this makes it a lot easier to perform ‘guess-and-check’ operations on my HTML and CSS that would otherwise have taken a lot of time if I had to keep modifying my code and restarting the debugger.”

In addition to Zander’s post, a post on the Visual Studio Blog describes additional JavaScript support in VS11, including support for remote JavaScript debugging.

“Remote JavaScript debugging is now supported (both on x86/amd64 and ARM remote devices): you can launch JavaScript Metro style apps on a remote device or attach to remote processes running JavaScript code,” wrote Dmitri Leonov, a software development engineer on the Visual Studio Ultimate team, in that post.

Do you know Google’s secrets? To find out, take our quiz.