WebStorm 2018.2 Help

Tool Windows Viewing Modes

WebStorm provides various viewing modes that let you control the way the tool windows are shown and behave. These modes help you keep a proper balance between quick, easy access to tool windows and maximum screen space for editing your code.

You can configure a number of general viewing options for tool windows under Window Options on the Appearance & Behavior | Appearance page of WebStorm settings (Ctrl+Alt+S).
Some viewing options described below can be configured separately for each of the tool windows.

Ways to control the viewing modes

The viewing modes are set by turning the corresponding viewing options on or off. To access these options, you can use:

  • icons general gearPlain svg on the title bar of a tool window.

    tool window viewing modes

  • Context menus. The context menus are accessed by right-clicking the tool window buttons or the tool window title bars.

    ws ps tool window viewing modes

  • For an active tool window: the Window | Active Tool Window menu.

Docked / undocked mode

A tool window in the fixed mode may be docked or undocked.

ws tool windows docked undocked

In the docked mode, all the sides of a tool window are attached to surrounding elements (the editor, other tool windows, etc.) Thus, the tool window and the adjacent elements share the space available in the main window.

When a docked tool window becomes inactive, it stays visible or is hidden depending on whether the window is pinned or unpinned.

Initially, all the tool windows are in the docked mode (i.e. the docked mode is on).

When undocked, all the sides of a tool window (except the one at the tool window bar) are detached from surrounding elements. The window moves to the "upper layer" covering the elements it used to share the space with. In one of the directions (along the tool window bar), the window stretches and takes all the available space. In the other direction, one of the window borders becomes loose and can be moved without affecting the sizes of other, underlying elements.

When an undocked tool window becomes inactive, it is automatically hidden.

To switch between the docked and undocked mode, turn the Docked Mode option on or off.

Fixed / floating / windowed mode

A tool window may be fixed. In that case, it stays within the main window.

Alternatively, a tool window may be in the floating or in the windowed mode.

ws tool windows fixed floating

When in the fixed mode, one side of the tool window is attached to one of the tool window bars. The behavior of the opposite side depends on whether the window is docked or undocked.

Initially, all the tool windows are in the fixed mode (i.e. the floating and windowed modes are off).

In the floating and in the windowed modes, a tool window may be moved around the screen to any place.

To switch to the floating or the windowed mode, turn on the Floating Mode or the Windowed Mode option. To bring a tool window back to the fixed mode, turn the Floating Mode and the Windowed Mode options off.

Note that for the tool windows in the windowed mode, the Window menu command Hide Active Tool Window is disabled.

Pinned / unpinned mode

Pinned tool windows, generally, stay visible when becoming inactive. Unpinned tool windows in such cases are automatically hidden.

Initially, all the tool windows are pinned (i.e. the pinned mode is on).

There may be slight differences in behavior depending on the other viewing modes:

  • Undocked tool windows are always hidden when inactive. (In the undocked mode, the tool windows are effectively unpinned.)

  • Floating pinned tool windows, when inactive, may become semi-transparent.

To switch between the pinned and unpinned mode, turn the Pinned Mode option on or off.

Split mode

This mode has to do with how many windows docked to the same tool window bar may be shown at a time (one or two).

Generally, the space along a tool window bar is shared between two groups of docked tool windows.

In one of the groups are the tool windows for which the split mode is off; in the other group are the ones with this mode on.

At each moment of time, only one window from each of the groups may be visible.

Thus, if all the tool windows docked to a tool window bar have the split mode off, only one tool window may be shown at a time. In this case, the tool window which is visible takes all the space available along the tool window bar. So when you make a certain window visible, the previous visible window is automatically hidden.

The same behavior is observed if the split mode is on for all the windows docked to the same tool window bar.

To be able to see two windows simultaneously, the corresponding windows should belong to different groups, that is, one of the windows should have the split mode off and the other one on.

ws tool windows split on off

The tool window buttons for the tool windows with different settings of the split mode are grouped and shown at different corners of the corresponding tool window bar. For vertical window bars, the windows with the split mode off have the buttons at the top corner; for the horizontal bars, the buttons for such windows are at the left corner.

To toggle the split mode, use the Split Mode option in the context menu of the window's title bar.

Group Tabs option

If more than one view is available in a tool window, the corresponding views may be shown on separate tabs if the Group Tabs option is off. If this option is on, the views are selected from a list.

ws shows views as tabs

Wide screen support

WebStorm makes it possible for the tool windows to use the full width and height of the screen. In the Settings dialog, expand the node Appearance and Behaviour, and in the Appearance page, use the checkboxes Wide screen tool window layout and Side by side layout on the left/right to optimize placement of the tool windows.

Note also that you can turn side-by-side layout on or off by Ctrl+MouseClick on splitter between the tool windows.

Refer to Widescreen tool window layout for details.

Last modified: 19 November 2018

See Also