WebStorm 2017.1 Early Access Preview

Ekaterina Prigara

Today we start the Early Access Preview for WebStorm 2017.1 (EAP). Download WebStorm 2017.1 EAP, build 171.1834.8, here and install it side by side with your current stable WebStorm. No active subscription is required.

Since we released WebStorm 2016.3 a month ago, we’ve mostly focused on fixes, but also managed to add some new features in WebStorm 2017.1 EAP. Many more are coming after the holiday season. Stay tuned!

Better testing experience

Now it’s even easier to run Mocha tests with the new Run icon on the gutter. Click on an icon next to the test or the suit name and select Run or Debug.

run-test-with-an-icon

Once you’ve run the tests, the icon will show their status – green circles for passed tests, red for failed ones. The run and debug actions will be still available on a click.

You can also re-run tests automatically on changes. To do so, click the Toggle auto-test icon on the left-hand side of the test tool window. You will see how their status changes in the editor, even if you have previously hidden the tool window. This will work both for Mocha and Karma.

auto-test

Don’t forget that you can also run Mocha tests with a shortcut: place the caret on a test or a suit name and press Ctrl-Shift-R on macOS or Ctrl+Shift+F10 on Windows & Linux.

The new Go to test action (Shift-Cmd-T on macOS or Ctrl+Shift+T on Windows & Linux) lets you quickly navigate from a file to a related test file that follows popular naming conventions, e.g. has a .test., .spec. or _spec. suffix and is located either next to a file or in a test folder.

Integration with the Angular language service

WebStorm adds integration with the Angular language service, developed by the Angular team to improve code analysis and completion for Angular-TypeScript projects.

To enable the service, first, run the following in your project root:

npm install @angular/language-service --save-dev

Important: Due to some limitations of the service, please use it with Angular 2.3.1 or higher and with TypeScript 2.0.10.

WebStorm will start the service together with the TypeScript service. You’ll see all the errors and warnings in your TypeScript and HTML files not only in the editor, but also in the TypeScript tool window.

angular-service

WebStorm will also add the results provided by the Angular service to code completion, wherever possible. All refactorings are powered by WebStorm.

Faster start with linters

WebStorm has integration with many popular linting tools that allows you to see the errors and warnings from these linters right in the editor.

Now when you open a new project that uses ESLint, TSLint, JSCS, or Stylelint (has it listed in package.json or has a related config file), error highlighting will be enabled automatically. You can always disable that (or enable for your existing project) in Preferences – just search for the name of the linter to get to the right configuration page.

Other noticeable features include:

  • Support for emoji in the editor (rendered as color images on macOS and as monochrome characters on Windows and Linux)
  • Zero-latency typing is now enabled by default
  • Support for do expressions ECMAScript proposal
  • WebStorm for Windows now comes with a bundled 64 bit JKD

The full list of issues addressed in this EAP build can be found on our issue tracker.

Learn more about other new features in WebStorm 2017.1:

  • WebStorm 2017.1 EAP, 171-2014: New intentions that convert forEach and for..in iterations over arrays to for..of; Code style options for quotes and ternary operators; New inspection Equality operator may cause type coercion.
  • WebStorm 2017.1 EAP, 171.2272:  Support for JavaScript Standard code style; Completion for package names and versions in package.json.
  • WebStorm 2017.1 EAP, 171.2455: Improved integration with TSLint; Code style options for the use of semicolons in JavaScript and TypeScript.
  • WebStorm 2017.1 EAP, 171.2822: Initial support for Vue.js; Code style option for trailing comma; Debugging Dart VM tests.

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.

– JetBrains WebStorm Team

Comments below can no longer be edited.

36 Responses to WebStorm 2017.1 Early Access Preview

  1. Mörre Noseshine says:

    December 21, 2016

    Did the font rendering change? Using the exact same font and font size (Consolas, 15pt) it now looks… different, very noticeably so. I’m not complaining, it’s not worse, merely different. I’m just curious what changed. I saw nothing in the release notes. Alternatively, the syntax-related individual color and font settings might have changed (but if that happened it was none of my doing).

    • Vincent says:

      December 22, 2016

      On ubuntu it looks just wrong.
      Anti-aliasing is off, and font size is decreased.

    • Alexey Ushakov says:

      December 22, 2016

      We’ve corrected font rendering for low resolution fonts, then should be now a little bit thin

  2. Didier Noumia says:

    December 21, 2016

    Anything new about react?

  3. Chris Harris says:

    December 21, 2016

    The ‘Platform and Plugin Updates’ dialog in my 2016.3 EAP build leads to a download for 2016.3.2 at https://www.jetbrains.com/webstorm/download/, not 2017.1.

    • Dennis Ushakov says:

      December 22, 2016

      Sorry about that, correct link will appear in a couple of minutes, in the meanwhile you can use this link

  4. Mörre Noseshine says:

    December 22, 2016

    Was their a change regarding the JRE? I used to run the 32bit version because somewhere there is an old blog post or forum comment saying it actually is better unless you really need 64bit WebStorm. After installing this EAP I was told there is no 32bit Java on my system and I had to use `webstorm64.exe` to start the IDE.

  5. Stavros Kefaleas says:

    December 22, 2016

    What about vue js 2 support?
    VueJS is getting more popular every day.
    Just look at its github stars.

    • Ekaterina Prigara says:

      December 23, 2016

      We definitely keep an eye at vue. And we don’t have a final roadmap for WebStorm 2017.1 yet. Stay tuned.

      • Paul Whitelock says:

        January 6, 2017

        +1 for Vue 2 support.

      • Michael Jason says:

        February 6, 2017

        +1 for vue support… keeping my hands crossed…

  6. jan says:

    December 23, 2016

    zero latency typing is pretty meh as the whole webstorm and it’s UI freezes occasionally. It’s good when it’s working but the webstorm is doing some stuff pretty often which freezes the whole ui. If webstorm wouldn’t run it’s ui in the same thread as the heavy lifting, zero typing latency would maybe make some sense.

    • Ekaterina Prigara says:

      December 23, 2016

      Thanks for your feedback. Would be very helpful if you report the performance issues you have by sending us a content of your IDE log folder (menu Help – Show log) to https://youtrack.jetbrains.com/issues/WEB
      Please also note that it’s an Early access preview build and it means that it is not fully tested and optimized, we publish them to get initial feedback.

    • Stavros Kefaleas says:

      December 23, 2016

      I had the same problem with you.
      Try to give a little more memory to the program (from 750mb to 1024mb for example) and see if that helps.
      Help –> Edit Custom VM Options

  7. Bastian says:

    December 29, 2016

    does anyone have problems with ctrl/cmd keys in the terminal on mac? can’t ctrl-c or copy/paste anything from that window.

    • Ekaterina Prigara says:

      December 29, 2016

      We are not aware of this issue. Please report it on our issue tracker and attach the IDE logs (menu Help – Show logs): https://youtrack.jetbrains.com/issues/IDEA
      Thank you!

      • Bastian says:

        December 30, 2016

        Thanks… it is fixed with the Dec 29. update.

  8. Refael Ackermann says:

    December 29, 2016

    What is the benefit of the bundled JRE64?

    • Ekaterina Prigara says:

      December 30, 2016

      One of the main reasons is to overcome memory limit (of the 32bit JDK) which can be allocated to IDE.

  9. Mörre Noseshine says:

    January 3, 2017

    Regarding Zero Latency mode, near the end of 2015 somebody very thoroughly tested that aspect of many editors on various OSs:

    https://pavelfatin.com/typing-with-pleasure/

    You’ll find that IDE *with Zero Latency enabled* did extremely well.

    In the current RC though I now occasionally get a dialog while typing that the on-disk version of the file differs from the in-memory version, and I guess that might be due to that zero-latency feature…?

    • Mörre Noseshine says:

      January 3, 2017

      Ooops… seems like the blog author is one of your developers. I missed that at first.

      • Ekaterina Prigara says:

        January 9, 2017

        Yes, Pavel works in the IntelliJ Core team. We’re still fine-tuning the typing. Would be very helpful if you report an issue about that in the IntelliJ IDEA tracker https://youtrack.jetbrains.com/issues/IDEA. Thanks!

  10. Mihail says:

    January 6, 2017

    Can you add auto-completion for data-*? Would really help me with Bootstrap.

    • Ekaterina Prigara says:

      January 9, 2017

      There’s no specific list from which the IDE can autocomplete the values for data-* attributes. You can write any attribute name. Though the attributes that are used at least once will appear in the completion results in the same project.

      • Mihail says:

        January 10, 2017

        But does Webstorm provide smart autocompletion for data-*? Meaning it will not suggest autocompletion for example data-slide when data-toggle was needed instead. Plus I think you can find some sort of lists in the bootstrap.js or bootstrap.min.js, however, I am not sure.

        • Ekaterina Prigara says:

          January 10, 2017

          As I said, WebStorm doesn’t provide smart completion for Bootstrap-specific data-* attributes. Only completion for attributes that were already used in your HTML code is available.
          We don’t plan to add such completion in the nearest future. Please feel free to file a feature request on https://youtrack.jetbrains.com/issues/WEB

      • Mihail says:

        January 10, 2017

        Concerning the list, I found this stackoverflow link: http://stackoverflow.com/questions/38336625/how-many-data-attributes-there-are-in-bootstrap-what-they-do-and-what-are-the-p. Hope it helps

  11. revena says:

    January 8, 2017

    uninstall, not yet support vue 😛

  12. Nikos says:

    February 21, 2017

    Is it possible to debug files that have JSX code in it yet?

    • Ekaterina Prigara says:

      February 21, 2017

      Yes, you can only put and step on breakpoints in JavaScript code in the jsx files (e.g. component metods, but not on the JSX tags – Chrome debugger protocol that we use doesn’t support it.

      • Nikos says:

        February 28, 2017

        Good work Ekaterina!!

  13. Andrew Spade says:

    March 16, 2017

    How could I run a specific Mocha test that uses ES6/Babel? I get an “unexpected token import” error.

    • Sergey Simonchik says:

      March 17, 2017

      Please make sure you’ve specified `–require babel-core/register` in “Extra Mocha options” field in Mocha run configuration

  14. Marco says:

    March 20, 2017

    Tslint stopped working, I’m not getting any visual error or warning (ie red lines on the scrollbar for example) as in the previous versions of WS.

    • Ekaterina Prigara says:

      March 20, 2017

      What WebStorm version do you use? What TSLint version you have? Please send us the content of your IDE log folder (menu Help – Show log) to https://youtrack.jetbrains.com/issues/WEB
      Thanks!