Early Access Program

WebStorm 2022.3 EAP #3: New Setting Sync Solution, and Improvements for Angular and CSS

WebStorm 2022.3 EAP build #3 is now available! To catch up on all the new features, check out our previous EAP blog posts.

The Toolbox App is the easiest way to get the EAP builds and keep both your stable and EAP versions up to date. You can also manually download the EAP builds from our website.


Important! WebStorm EAP builds are not fully tested and might be unstable.

Below, you’ll find some of the improvements available in WebStorm 2022.3 EAP #3. Please try them out and share your feedback using our issue tracker or in the comments.

New Settings Sync solution

In this EAP build, we’ve introduced a reworked solution to synchronize your custom IDE settings.

For a long time now, two solutions have existed in parallel and featured intersecting functionality – IDE Settings Sync and Settings Repository, which were bundled with WebStorm as plugins. To avoid the confusion caused by having two similar bundled plugins, we’ve merged their feature sets into a single solution – the new Settings Sync plugin. It covers all the basic prerequisites for settings synchronization and is now available in WebStorm and our other IntelliJ-based IDEs.

Enable settings sync in the WebStorm settings

Settings synchronization is essential if you use your IntelliJ-based IDEs on multiple computers. After changing a color scheme or a keymap on a machine, you’ll want to have the same setup on your other machines. If you have only one machine, Settings Sync can still be useful as a backup solution, as it will allow you to automatically restore all your settings when setting up a new machine from scratch.

The new Settings Sync plugin can sync all the shareable IDE settings, bundled plugins, and third-party plugins. By default, the plugins themselves will be synced and installed silently. As for the third-party plugin settings, not all of them will be transferred seamlessly, as this is dependent on the vendors. We are in discussions with plugin developers about the actions required from their side.

How does the new Settings Sync plugin work?

The settings are stored in the cloud attached to your JetBrains Account. If you use different IntelliJ-based IDEs with the same JetBrains Account, your settings will automatically sync.

In the cases where a conflict arises due to the simultaneous modification of settings on two different computers, the settings will be merged using the most recent configuration.

How to enable the new Settings Sync plugin

Depending on your current approach to settings synchronization, you may need to enable the new plugin manually:

  • If you have been using IDE Settings Sync, your data will be automatically migrated to the new plugin, so you won’t need to take any action.
  • If you are a Settings Repository user, we advise you to continue using your current setup, as the migration is still a work in progress. You’ll get an in-IDE notification when the functionality is ready.
  • If you weren’t previously using a settings synchronization solution but want to try the new one, you can enable it via Preferences / Settings | Settings Sync | Enable Settings Sync.

Important note on the new Settings Sync plugin

Here are two important points about switching to the new solution:

  1. If you’re using WebStorm 2022.2.x or earlier with the old Settings Sync plugin and want to enable the new plugin on v2022.3, your settings will be migrated from the older version, but they won’t be synchronized between v2022.2 and v2022.3 afterwards.
  2. The Settings Repository plugin has been unbundled. If you’re using it, your settings will be migrated when upgrading to v2022.3, but the new Settings Sync plugin won’t be turned on automatically. If you want to keep on using the Settings Repository plugin, you’ll need to install it manually from JetBrains Marketplace.

Improved copy-cut-paste behavior

We’ve improved the editing experience in the IDE by reworking the paste action (⌘V / Ctrl+V) behavior. Now when you copy (⌘C / Ctrl+C) or cut (⌘X / Ctrl+X) a line without any code selected, the paste action will add the contents of the clipboard to above the current line, not at your caret, as it used to in previous versions. You can disable this behavior in Preferences / Settings | Advanced Settings.

Copy and paste in the editor and pasting to line above

Support for new CSS features

We’ve made a number of improvements to the CSS support in WebStorm in this release.

First, WebStorm now understands the @supports at-rule, which associates a block of statements with an @supports condition.

No more errors shown in the selector syntax

WebStorm 2022.3 also includes support for viewport units. The viewport-percentage lengths are relative to the size of the initial containing block – which is itself based on the size of either the viewport (for continuous media) or the page area (for paged media) – and are scaled accordingly.

using vh properties in the CSS and previewing the result

We’ve also added support for range media queries (WEB-56889), container queries (WEB-55074), @layer (Cascade layers) (WEB-55075), and color modification functions (WEB-54909).

Updates for Angular

WebStorm now excludes the .angular cache folder from global searches. This will help provide better search results as you will no longer be getting results from this directory.

Showing the .angular cahche folder is not included in global searches

As part of our ongoing improvements for Angular support in WebStorm, we’ve also fixed a few issues:

  • We’ve disabled the “Inaccessible component member” warning that was being shown for protected fields (WEB-56190).
  • We’ve fixed the issue with incorrect type evaluation of as variables in structural directives (WEB-49393).
  • WebStorm now infers the ngrx type correctly when using ngTemplateContextGuard (WEB-52068).

That’s it for today. For the full list of the improvements available in WebStorm 2022.3 EAP #3, check out the release notes.

The WebStorm team

image description