Web Browsers and Preview
On this page, you can configure the following:
Integrate installations of Web browsers with WebStorm, activate or deactivate launching Web browsers from WebStorm.
Specify whether a browser will be launched by running its executable file or through the default system command.
Appoint the default WebStorm browser in which WebStorm will open HTML files upon request by default, that is, when no browser is specified explicitly
Enable the browser popup for opening HTML or XML files in the browser.
Configure when a page should be reloaded automatically in the browser or in the built-in preview.
Learn more from Configure browsers
Browsers
In this section, specify which browsers will be available for previewing HTML output. The section shows the browsers from the predefined list and the previously configured custom browser installations, if any.
WebStorm is shipped with a predefined list of most popular browsers that you may install and launch automatically from the IDE during running, debugging, or previewing the output of an HTML file. WebStorm presumes that you install browsers according to a standard procedure and assigns each installation an alias which stands for the default path to the browser's executable file or macOS application.
If in your actual browser installation the path to the executable file is different, you need to specify it explicitly in the Path field.
In addition to the predefined browsers, you can configure as many custom browser installations as you need using the controls on the toolbar.
Item | Description |
---|---|
Active | Select this checkbox to enable the use of the respective browser from WebStorm. The browser will be added to the context menu of the Configure the browser icons popup to learn how to hide and show the popup in the editor. menu item and its icon will be displayed in the browser icons popup. SeeIf this checkbox is cleared, the corresponding browser icon will not appear in the icons toolbar or popup. |
Name | In this column, specify the browser name. |
Family | In this column, specify the family to which the browser belongs. |
Path | In this column, specify the path to the executable. If the browser was installed according to a standard installation procedure, most likely the alias in the Path field points at the right location. If it does not, click and select the actual path in the dialog that opens. In the dialog that opens, select the path to the executable file of the corresponding browser. |
Toolbar
Item | Description |
---|---|
Click this button to add a custom browser to the list. | |
Click this button to delete the selected customer browser from the list. Note that you cannot delete the browsers from the predefined list. | |
Click this button to specify a custom profile for Firefox or a browser of the Chrome family. The button is available only when Firefox and Chrome are selected. In the Firefox Settings dialog, specify the Firefox browser profile to use for previewing output:
In the Chrome Settings dialog:
| |
Use these buttons to move the selected browser up or down in the list. The order of browsers is important for rendering external resources and previewing files with Web contents. | |
Click this button to create a copy of the selected browser. |
Default Browser
In this section, specify the default WebStorm browser that will be used by default for rendering external resources and previewing files with Web contents. This browser will be referred to as Default in the context menu when you choose from the main menu or from the context menu of a file.
Item | Description |
---|---|
Default browser | Select the default browser from the list. The possible options are:
|
Configure the browser icons popup in the editor
In this area, configure whether you want WebStorm to show a popup with enabled browsers in HTML or XML files. This popup is used to preview the output of the current file.
By default, the browser icons popup appears only in HTML files. In XML files, the popup by default does not show up to help you read and edit your code without distraction. Use the For HTML files and For XML files checkboxes to have the popup displayed or hidden depending on the current file type.
Reload behaviour
In this area, specify the actions that trigger reloading HTML pages automatically in the browser or in the built-in preview. Learn more from Preview an HTML file in a browser.
From the Reload page in browser and Reload page in built-in preview lists, select the actions that will trigger automatic reload of pages in web browsers and in the built-in preview.
By default, On Save is selected, so after you open an HTML file in the browser or in the built-in preview, WebStorm automatically reloads the page every time this HTML file (or any linked JavaScript or Style Sheet file) is saved manually or automatically, refer to Save and revert changes.
When you save a file that triggers page reload, WebStorm shows a Got it tooltip.
If you select On Change, pages are reloaded as you type.
To suppress automatic reload of pages, select Disabled.