WebStorm 11 EAP, 142.4723: code style for chained methods, React and TypeScript 1.6 support improvements

A new WebStorm 11 EAP build (142.4723) is now available for download.

We are already half-way though our Early access program, here’s what was done so far:

  • WebStorm 11 Early Access Program: improved TypeScript 1.5 support, TSLint integration, Yeoman integration, new Node.js inspections, support for debugging Webpack, option to run single Mocha test, flame charts in V8 CPU profiler and more.
  • WebStorm 11 EAP, 142.3805: improved HiDPI support for Windows and Linux, clickable links in comments, breadcrumbs in Stylus files.
  • WebStorm 11 EAP, 142.4148: encode HTML symbols, Meteor, TypeScript 1.6 features.

Formatting for chained methods

WebStorm now helps your format chained methods.
In Preferences | Editor | Code Style you can configure whether to wrap chained method calls in your JavaScript code on reformatting or not:

wrap_chained_methods

code_style_chained_methods

And also whether to indent them:

indent_chained_methods

Improvements in ReactJS support: better navigation and coding assistance for React-specific attributes

Now you can very quickly jump from a component usage to its definition even if it’s in a different file. Cmd-click (Ctrl-click) or hit Cmd-B (Ctrl-B) on a component name to navigate to it or hit Cmd-Y (Ctrl-Shift-I on Windows and Linux) to see a quick definition in a popup.

navigate_to_react_component

In addition to that now you can get coding assistance for React-specific attributes in JSX code, like className.

More TypeScript 1.6 features supported

We added support for a number of new TypeScript 1.6 features: Local types, support for exclude property in tsconfig.json filetype parameters in type aliases and
abstract classes.

abstract_class

The full list of addressed issues is available in the release notes.

Download WebStorm 11 EAP (build 142.4723).Patch update from the previous EAP build, 142.4148 is available.

Please report your feedback to our issue tracker. To get notifications of new EAP builds as they become available, subscribe to the EAP channel in Preferences | Appearance & Behavior | System Settings | Updates.

Develop with pleasure!
– JetBrains WebStorm Team

About Ekaterina Prigara

Ekaterina Prigara is WebStorm product marketing manager at JetBrains. She's passionate about new technologies, UX and coffee.
This entry was posted in Early Access Preview and tagged , . Bookmark the permalink.

13 Responses to WebStorm 11 EAP, 142.4723: code style for chained methods, React and TypeScript 1.6 support improvements

  1. I’m almost satisfied with the chained method support, one thing that I would like to see added:

    Right now I can only choose “indent” or “don’t indent” chained methods.

    I would like to have two settings though: One for chained assignments and one for chained functions (without assignment of the result).

    Background: I do like indentation for assignments because this way I always see that “up there” (possibly many lines above) the result is assigned to a variable.

    On the other hand, when I use Promises and chain a lot of .then(...) calls for the sole purpose of coping with asynchronous execution I do NOT want indentation.

    Those two uses for chained methods are very different! One is to process data over several steps, the other one is purely “technical” due to async. vs. sync. parts of the programs.

    I added this comment to an issue for chained method support.

    • Ekaterina Prigara says:

      Thanks, my colleague will reply to you in the issue. It’s better to keep the discussions there, so that anyone can follow.

  2. Richard Collette says:

    Is the chained method formatting something supported by .editorconfig?

  3. gmercer says:

    Hi Ekaterina ,

    You seem to be able to find the answers, so I am bugging you.

    I am trying to push for the purchase of WebStorm for our devs, but there is one last hurdle for which I cannot find a recipe (if it doesn’t currently exist maybe it could be tweaked into EAP 11)

    We have legacy Servlets that act as our datasource and also serve up our angular app in production, the Servlets are unlikely to be replaced in the near future, so for development we run tomcat on our local machines and I have shown how gulp-connect can modRewrite in order to access data from the Servlets and using gulp watch + livereload gives us instant feedback on changes made in WebStorm, with all the great features.

    At the moment, our debugging is done via Chrome Dev Tools. Our gulp does not perform any transforms but in the future it is likely to do so.
    As I understand it the built-in web server for live edit does not offer the ability to configure a modRewrite or equivalent.

    Is it currently possible to have gulp serve the files (so that we can configure a modRewrite), and get the JetBrains IDE Support plugin to interact with WebStorm in order to debug an angular app directly in WebStorm?

    If not, is this possible in the future?

    • Dennis Ushakov says:

      As Ekaterina is currently on vacation I’ll try to jump in.

      Yes, it’s possible. You need to create JavaScript debug configuration, type in url of your project and specify mapping between local folders and remote url like this: http://d.pr/i/wnLt

  4. gmercer says:

    Thanks Dennis.

    Working now, it seems that my earlier failed attempts had opened too many tabs referencing the application and I got an error message along the lines
    “cannot get list of inspectable pages”.

    Still, it would be great if the built-in webserver offered config, such as rewrite

  5. Hi,

    There seems to be a problem with typescript + chain methods formatting. Maybe it is related to this https://github.com/Microsoft/TypeScript/issues/1888, but not really sure. I tried everything in Editor -> Code Style -> TypeScript but nothing seems to work.
    I am using WebStorm 11 EAP, 142.4723; can you advice please ?

  6. Stepan Mikhaylyuk says:

    Hello!
    I installed.

    But webstorm emits errors in my ts/tsx files.
    is it version support tsx? What about your plans for support this feature?
    Thank you!

  7. Julian Acosta says:

    Hello, I want to know if (and when) will be support for ember-cli

    Thank you!

Leave a Reply

Your email address will not be published. Required fields are marked *