New in 5.0: Google Closure Compiler JSDoc Annotations

Konstantin Ulitin

Providing comments and annotations to your JavaScript code is a way to make it more definite and easier to read by other developers. It is especially important in large projects. Some static code analysis tools and verifiers take types and other information provided in JSDoc tags into consideration and report warnings if code is inconsistent with annotations. We suggest you as developers to developers to use annotations as much as possible.

JSDoc tags support in PhpStorm/WebStorm 5.0 has been improved to make your coding experience better. When something is known about current context, more relevant completion options will be shown and more static errors will be reported instantly. In the upcoming PhpStorm/WebStorm 5.0 EAP nearly all of Google Closure compiler JSDoc tags are supported.  In addition to @param, @type, @extends etc., following tags will also be handled better:

@interface and @implements

Quick fix(Alt+Enter) automatically implements all methods.Clicking on gutter icon allows you to jump to overridden function.When not all methods from interface are implemented, IDE will warn you about it and suggest to implement methods. Symbols from base interface will go to the completion list even if they are not implemented in a subclass (or IDE doesn’t see them to be implemented).

multiple inheritance

Completion shows options from all extended classes

@typedef

Typedef is used for complex types aliasing

@private and @protected

When @private or @protected tag is specified for property, it won't appear in completion according to visibility rules

You should disable checkbox “Weaker type guess for completion” in Settings|JavaScript if you want symbols marked with @private and @protected tags to be removed from completion list in contexts where they are not accessible.

Also @enum, @override, @inheritDoc, @property, @lends, @constructs, @mixin and @mixes are supported now and completion, documentation lookup and parameter info take them into consideration.

You can already try all of described functionality in the latest EAP, so don’t hesitate to download it. Bug reports and suggestions are welcomed in our issue tracker.

Coming soon: enhanced Google Closure types syntax.

Comments below can no longer be edited.

19 Responses to New in 5.0: Google Closure Compiler JSDoc Annotations

  1. Karlheinz says:

    August 2, 2012

    At last this feature ist implemented! Nice work!

  2. Maxim Dikun says:

    August 2, 2012

    This is the best news I’ve ever heard! I’m switching to EAP right now. And I hope all warnings in my current JsDocs will magically disapear. =)

  3. Marcel Anacker says:

    August 2, 2012

    Wow, thats great. Even though type inference and annotations for Google Closure works quite well in PhpStorm 4, further support is highly appreciated. Downloading 5.0 EAP right now …

  4. Rafi B says:

    August 2, 2012

    Hooray for JSDoc !

  5. Vic says:

    August 2, 2012

    Great!

    Funny thing. I made a request on youtrack yesterday about support for this feature. I guess I have to read the development road map a bit better 🙂

  6. Konstantin Ulitin says:

    August 2, 2012

    Thanks all of you for kind words! If you are still encountering any issues, please report them, so we’ll fix them before release.

  7. Jason Lotito says:

    August 2, 2012

    Well hot damn. That is just awesome! We use CC here, and getting official support for it in Storm is just awesome!

  8. Vladimir Chernis says:

    August 7, 2012

    This is so cool!

    Are there plans to implement the closure compiler type checking (e.g. error when calling a function that expects an int param with a string param instead)?

    • Konstantin Ulitin says:

      August 8, 2012

      This is basically supported in 4.0 already. For example,

      /** @param {number} i */
      function f(i) {}
      f("some text");

      is producing a weak warning. Please ensure that inspection JavaScript|General|Type mismatch problem is enabled. If it still doesn’t work, please provide your code example here or in our tracker.

      • Vladimir Chernis says:

        August 11, 2012

        спасибо 🙂

      • Vladimir Chernis says:

        August 14, 2012

        It works sometimes. I’m having difficultly coming up with a reasonable-sized test case.

  9. Vladimir Chernis says:

    August 8, 2012

    Er I guess “number” not “int.”

  10. Karlheinz says:

    August 9, 2012

    Will this work with loaded files from require.js?

  11. Odin says:

    August 21, 2012

    Will this be included in IntelliJ also?

    • Konstantin Ulitin says:

      August 21, 2012

      Yes, you can already explore it in the latest IDEA EAP.

  12. Ken Goulding says:

    August 28, 2012

    Don’t forget @see!

    I’m finding it really useful to mark up my code with the @see tag as a way to associate related classes and methods and navigate between them using Ctrl+Click.

    What other useful tags are now supported?

  13. Sergey Ermakovich says:

    October 4, 2012

    I love this new feature!

  14. Scott Logic » TypeScript versus Closure says:

    October 29, 2012

    […] nor is able to hint when adding the type information. As John points out in the comments, WebStorm now supports most of the Closure syntax. *4 Again as John points out in the comments, it is possible to have the compiler insert runtime […]

  15. WebStorm 6 EAP build 126.37 | WebStorm & PhpStorm Blog says:

    January 24, 2013

    […] to class action now brings you to JavaScript (via @constructor) and TypeScript […]