WebStorm Tool Windows
Attached to the bottom and sides of the workspace are WebStorm tool windows. These secondary windows let you look at your project from different perspectives and provide access to typical development tasks. These include project management, source code search and navigation, running and debugging, integration with version control systems, and many other specific tasks.
Certain tool windows are available always, that is, in any project irrespective of the project nature, contents, and configuration. Other tool windows are available only if the corresponding plugins are enabled. There are also tool windows that only appear when certain actions are performed. For example, to invoke Find tool window you need to initialize a search.
Tool window quick access
In the lower left corner of the workspace, there is a button which initially looks like this .
If you hover the mouse cursor over this button, a menu opens that provides quick access to tool windows:
If you click this button, tool window bars and buttons are shown. At the same time the button, appearance toggles to . If you click the button again, the tool window bars and buttons are hidden again.
Tool window bars and buttons
When visible, the tool window button bars (or just tool window bars) are around the tool windows (or the editor area if the tool windows are hidden). These bars contain the buttons for showing or hiding the tool windows (tool window buttons).
The tool window buttons also provide access to tool window context menus displayed if you right-click a tool window button:
The context menus let you control the tool window viewing modes and other aspects of the tool window appearance.
Initially, there are three button bars, two at the sides of the main window and one at the bottom. You can show or hide all button bars at once by clicking in the bottom-left corner of the workspace.
Each tool window button has the name of the corresponding tool window on it. On certain buttons, the window name may be preceded by a number, for example, 1: Project. This means that the keyboard shortcut Alt+<number> ⌘+<number> is available for showing or hiding the window. You can, for example, show or hide the Project tool window by pressing Alt+1 ⌘+1.
You can turn showing the window access numbers on the buttons on and off in the Appearance settings.
The buttons for visible tool windows and for hidden ones are shown differently.
You can rearrange the tool windows by dragging-and-dropping the tool window buttons onto a different tool window bar (or to a different corner of the same bar). As a result, the tool window becomes attached to the bar you've moved the window button to.
General tool window layout
Generally, all tool windows are organized in a similar way.
At the top of the window is a title bar. When you right-click the title bar, a menu for managing the window appearance and contents is shown.
The title bar contains two buttons in its right-hand part. The first of these buttons () opens a menu for managing the tool window viewing modes. Note that the menu options are a subset of the title bar context menu.
The second of the buttons () is for hiding the tool window. When used in combination with the Alt⌘ key, clicking this button hides all the windows attached to the same tool window bar.
Underneath the title bar are the toolbar and content pane. Depending on the window, the toolbar may be above or to the left of the content pane.
The toolbar buttons, generally, are window-specific. However, the windows with similar purposes may contain similar controls on their toolbars.
In most cases, a function associated with a toolbar button may also be accessed from the main or context menu, or may have a keyboard equivalent.
The content panes may be plain or contain two or more "layers" (views) represented, for example, by tabs. There are also tool windows with the content pane part shown on a separate tab in the editor area.
Accessing tool window menus
- Use the menu to show or hide the tool windows.