Early Access Program

WebStorm 2017.3 EAP, 173.3415: improved Angular support, updated Live Edit configuration

The new WebStorm 2017.3 Early Preview build (173.3415.27) is now available. There have been improvements in the Angular support, and updates for the Live Edit configuration.

You can update via Toolbox App, or download the build here and install it beside your stable WebStorm version.

Download WebStorm 2017.3 EAP

To learn more about all the new features added in earlier WebStorm 2017.3 EAP builds, please check out these blog posts.

Updated Live Edit configuration

For a while now, WebStorm has included a feature called Live Edit that worked during the JavaScript debug session to allow you to see the changes you made in your HTML and CSS files immediately in the browser.

Earlier in the course of this EAP we announced that WebStorm no longer requires a Chrome extension for debugging the client-side JavaScript code. However, the Live Edit feature still requires having it installed.

We’ve updated the configuration of Live Edit in Preferences | Build, Execution, Deployment | Debugger | Live Edit to allow you to enable and disable it completely.


Now if you have checked the “Update application in Chrome” option, WebStorm will start a JavaScript debug configuration that requires the JetBrains IDE Support extension; and Live Edit will show your changes in HTML and CSS files.

If the checkbox is unchecked, WebStorm will start the debugger in a new instance of Chrome, without requiring you to have the extension. By default, the Live Edit is disabled.

Improved Angular support

This update has several improvements regarding Angular support.

First, there’s now completion for property bindings in Angular templates.


Second, if a component extends a base class that has event attributes created using @Output decorator, completion for these attributes will work properly for that component (WEB-25652).

And last but not least, WebStorm now uses the metadata.json file (it’s available, for example, in Angular and Angular Material modules) instead of a compiled JavaScript bundle to provide code completion for tags and attributes. As a result, WebStorm needs less time to index the project.

You can find a list of all addressed issues in the Release notes.

Please share your feedback and report issues on our tracker. Thank you!

WebStorm Team

Comments below can no longer be edited.

5 Responses to WebStorm 2017.3 EAP, 173.3415: improved Angular support, updated Live Edit configuration

  1. Avatar

    Dennis Du Krøger says:

    November 10, 2017

    (I’m using IntelliJ, so this may already have been fixed in WebStorm).
    Does this also add support for as and else in the structural directives? They were added in Angular 4, so it’s pretty disappointing that it has taken so long.

    • Ekaterina Prigara

      Ekaterina Prigara says:

      November 10, 2017

      Sorry for that. This issue is related to the support for the structural directives, so please vote for it and follow it for the updates: https://youtrack.jetbrains.com/issue/WEB-29300
      We hope to get it fixed for the IntelliJ IDEA 2017.3 release.

      • Avatar

        Dennis Du Krøger says:

        November 10, 2017

        Ah, super. Voted, thanks a lot! 🙂

  2. Avatar

    Feder says:

    February 2, 2018

    Hi all! I’m using PhpStorm. I’ve installed and activated the plugin in the IDE and the extension in Chrome. Unfortunately the live edit works just with the html files whereas nothing happens when I edit Css and Javascript in the same project. If I look through Run>Edit configuration I see that perhaps I should configure the node interpreter under Node js but I have no idea how to proceed. Many thanks for any tips.

    • Ekaterina Prigara

      Ekaterina Prigara says:

      February 5, 2018

      You don’t need to configure Node.js if you want to use the Live Edit feature for your client-side code.
      You need to create a new JavaScript Debug configuration, specify the URL your app is running on and start the debug session. Please also have a look at the options available in Preferences | Build, Execution, Deployment | Debugger | Live Edit: you need to check “Update application in Chrome” and “On changes” checkboxes and, if you want, the “Restart if hotswap fails” checkbox.
      If it doesn’t help, please contact our . Thanks!