Javascript Intellisense in Visual Studio "Orcas"

In February I did a blog post called My "First Look at Orcas" Presentation. It provided a good summary of some of the cool web development features coming with Visual Studio "Orcas".  If you haven't had a chance to read it, I recommend checking it out here.

One of the most highly anticipated features is the support for client Javascript Intellisense within Visual Studio "Orcas" (this feature also works in the free Visual Web Developer Express edition).

If you have ever been frustrated by manually typing Javascript before, you are going to be in for a pleasant treat with "Orcas".  Visual Studio now provides full Javascript Intellisense completion in .aspx files, .htm files, as well as in external .js files.  It delivers Intellisense for vanilla Javascript code, as well as provides rich support for the new ASP.NET AJAX client Javascript framework and Javascript code built with it.

You can read more about some of the Visual Studio "Orcas" Javascript features in these two overview posts from the VS Web Tools Team here:

As Wally recently blogged about, one of the cool things about the VS "Orcas" Javascript Intellisense support is that it has been designed to "just work" out of the box.  This means you don't have to run any tools on your Javascript files to build-up the Intellisense hints.  Nor do you have to decorate your Javascript in a specific way in order to make it work.  If you have a standard Javascript function or prototype class you've built in your external Javascript file, you should get Intellisense completion against it within Visual Studio automatically.

Optional Javascript Doc Comments

Visual Studio also allows you to optionally add documentation comments to your code/libraries that can further help the Intellisense engine, as well as enable developers to provide documentation comments that the VS Intellisense engine can pick up and use for summary comments and type descriptors/validation checking.

For example, if you added this XML summary comment to your code:

Visual Studio will automatically display the summary details, as well as provide in-line help when typing the parameter values:

The Format for Javascript Doc Comments

Bertrand Le Roy from the ASP.NET Team recently made a great blog post that details the documentation summary comment format that is used by both ASP.NET AJAX and Visual Studio "Orcas".  Among other great things it includes details on:

  • How to Add Summary Details for Classes, Methods and Parameters
  • How to localize Documentation in Javascript
  • How to indicate that one external Javascript file requires (or references) another external Javascript file and should have its Javascript Intellisense assume that the other methods and classes are "in-scope" when the external JavaScript file is used (which is super useful anytime you are using any AJAX framework library).

I highly recommend checking out his blog post here.

The ASP.NET AJAX Control Toolkit also now has a built-in MSBuild task that you can add to your web projects that can automatically strip out these documentation comments (along with whitespace and other non-needed content) from your JavaScript files when compiling a project in "release" mode.  This provides a really useful utility that enables you to maintain debug/descriptive versions of your Javascript at development time, and then allow you to throw a switch to generate versions optimized for efficient download at runtime.

Hope this helps,

Scott

Published Tuesday, April 24, 2007 12:24 AM by ScottGu

Comments

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 6:37 AM by Rachit

This is nice...really nice! I was awaiting for this feature.

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 6:49 AM by Will Sahatdjian

Between this and LINQ to SQL I seriously can not wait for this upgrade.  Nice work!

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 8:15 AM by Vikram

wow, Thats a really Herculean effort by the orcas team

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 8:17 AM by Brendan

Finally I won't have to use a second editor just to write my JavaScript. I've been waiting patiently for this.

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 8:22 AM by Stuart

Scott,

Any ideas as to when Orcas B1 will be available for those of us without MSDN subs?

Thanks for your time.

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 9:26 AM by Ivan Mostacero

Really Excelent!!!! :)

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 9:30 AM by Chris Field

Typically, I found out how to include the JavascriptCommentStripper in a build process after posting...

 <UsingTask AssemblyFile="..\Support\JavaScriptCommentStripper.dll" TaskName="JavaScriptCommentStripperTask" />

 <Target Name="AfterBuild">

   <JavaScriptCommentStripperTask SourceFiles="$(Configuration)\scripts\ForgottenPassword.js" DestinationFiles="$(Configuration)\scripts\ForgottenPassword.js"></JavaScriptCommentStripperTask>

   etc...

 </Target>

Typical! :)

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 10:37 AM by Steve Harman

Scott,

Reading through the WebDevTools' "JavaScript Intellisense in Visual Studio Orcas" post linked to above, several people ask about Intellisense support for external Javascript libs. Ayende re-iterates the question but the only reply is along the "let us know what you want" lines.

The ability to support external Javascript libraries would be a huge plus for Orcas... in another arena I might even go so far to call it a "Killer Feature" of the IDE.

So, my question is - who (and where) do we contact to with our list of "must support" libraries? Should we use the MS Connection site?

Oh... and as usual - solid work and thanks for keeping us informed.

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 11:03 AM by zebra

finally, some intellisense for JS :-D

but will they have the background compiling lag? please make sure you get all that performance thing fixed before release.

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 11:06 AM by ScottGu

Hi Steve,

I know the team has been testing out Prototype and Dojo with the Javascript Intellisense feature.

Prototype works reasonably well with Beta1 - the only challange with it is that it uses dynamic methods/constructors in a few places (meaning code executes somewhere to dynamically add these members to the object at runtime).  This makes it pretty tricky/impossible for a tool to infer the Intellisense for these members without sometype of documentation hints file.

Bertrand is now on the OpenAjax group (see this post for details: http://weblogs.asp.net/scottgu/archive/2007/03/20/microsoft-joins-openajax-alliance.aspx).

One of the things the group is talking about right now is ways to standardize doc comments for tools to further help with Intellisense.  If the group gets to consensus on this, then we'll be able to have a common format that all AJAX libraries will implement, in which case VS should be able to provide full Intellisense for every AJAX library (regardless of any dynamic member code generation they do).

Hope this helps,

Scott

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 11:46 AM by Steve Harman

Thanks for the update Scott - now let's just hope the OpenAjax group can come to a consensus in time for the results to make it into Orcas. :)

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 2:53 PM by Stephen

Uh, didn't Visual Interdev 6.0 from 1999-2000 contain this feature?  Add it was removed for .Net.

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 3:09 PM by jsp3536

I tried the javascript intellisense on a simple javascript custom object that has one property and one method.  I can't get the intellisense to work at all.  Is there something else in VS Orcas that needs to be configured in order for this to work?

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, April 24, 2007 5:08 PM by jsp

How to you get intellisense on a simple custom javascript object?  I can't get it to work.

# re: Javascript Intellisense in Visual Studio "Orcas"

Wednesday, April 25, 2007 8:24 PM by Ryan

Orcas is looking really nice.  Between this, the AJAX Library and LINQ I am really looking forward to the new release.  Besides the intellisense, being able to place javascript breakpoints right in VS will be very nice.

# re: Javascript Intellisense in Visual Studio "Orcas"

Thursday, April 26, 2007 3:06 AM by ScottGu

Hi Stephen,

Visual Interdev had intellisense against known objects (like html elements), but not against arbitrary Javascript or against Javascript functions you added yourself.

The support in VS Orcas goes much, much farther than this.

Thanks,

Scott

# re: Javascript Intellisense in Visual Studio "Orcas"

Thursday, April 26, 2007 3:10 AM by ScottGu

Hi jsp3536,

If you can send me a sample that isn't working for you with Beta1 of "Orcas", I can loop you in with someone on the team to investigate.

Thanks,

Scott

# re: Javascript Intellisense in Visual Studio "Orcas"

Thursday, April 26, 2007 9:42 AM by Joh Lewicki

Regarding the Intellisense seemingly not working, I had the same issue when I tried it using a 'Web Application' project.  Then I tried it using a 'Web Site' file system based web application, and that seemed to convince it to work as advertised...

# re: Javascript Intellisense in Visual Studio "Orcas"

Thursday, April 26, 2007 1:12 PM by Michael Stuart

I have not had a chance to download the beta yet, but I really hope the new editor supports collapsible sections within javascript code.  I wouldn't even mind having to use some specific comment lines to get it to work (like #region in c#).  Also, a list of the objects/functions within the .js file would really help as well in order to jump within the file faster.  Maybe it already has these in it...

# re: Javascript Intellisense in Visual Studio "Orcas"

Friday, April 27, 2007 1:34 AM by Kiran Dayalu

Something people like me (ASP.NET developers and early AJAX birds) really needed to become comfortable with MS AJAX JavaScript. Keep up the good work.

# re: Javascript Intellisense in Visual Studio "Orcas"

Friday, April 27, 2007 3:32 PM by Anderson Fortaleza

Hey Scott, great stuff over there, looks like we'll need nothing but Visual Studio !

Will you write about projections ? It's freaking amazing stuff, I'd like to read more about it.

thx !

-- Anderson

# re: Javascript Intellisense in Visual Studio "Orcas"

Friday, April 27, 2007 7:59 PM by Fargii

Fantastic, an IDE with intellisense support for javascript is a dream come true. You guys seam to be moving in the right dxn lately !!

# re: Javascript Intellisense in Visual Studio "Orcas"

Sunday, April 29, 2007 3:02 PM by Salman Farsi

I always frustrated when have to write some typical JavaScript, but my life is going to easy with this great enhancement. I hope it will improve my productivity.

# re: Javascript Intellisense in Visual Studio "Orcas"

Saturday, May 5, 2007 1:20 PM by Daren K

I've been using Aptana (a free utility) which provides intellinse for Javascript.

Having it in Orcas sounds great. It will be nice to have everything under the one IDE!

# re: Javascript Intellisense in Visual Studio "Orcas"

Monday, May 7, 2007 12:39 PM by Dan Amiga

Hi Scott,

Does orca beta 1 (or next versions? ) suppose to support intellisence for ASP.NET AJAX namespaces, classes and interfaces ?

# re: Javascript Intellisense in Visual Studio "Orcas"

Tuesday, May 8, 2007 6:29 AM by ScottGu

Hi Dan,

Yes - Beta1 supports intellisense for the ASP.NET AJAX namespaces, classes and interfaces.

Thanks,

Scott

# re: Javascript Intellisense in Visual Studio "Orcas"

Monday, May 14, 2007 7:33 PM by Jonas Follesø

Hi Scott,

First of all, the JavaScript support in Orcas is _amazing_. I'm currently looking into how to use Orcas for Gadget development.

If I've understood correctly you can add "references" like this (both to JS files, and assemblies).

/// <reference path="Library.js" />

Is there a way to get intellisense support for the Windows Vista Sidebar Object Model when writing Sidebar gadgets?

That would just be totally awsome!

Best regards,

Jonas Follesø

# re: Javascript Intellisense in Visual Studio "Orcas"

Wednesday, May 30, 2007 8:25 PM by Jon Davis

Does anyone know if the new Javascript intellisense will support old-school COM/ActiveX type introspection as Visual InterDev did?