Small programs that add new features to your browser and personalize your browsing experience. I am not able to debug my Karma unit tests in WebStorm. How can I fix it? I see this message when I click the debug button: I checked How do I know what's wrong. Chrome://extensions shows: Click. With Chrome 86 (released on October 6, 2020) and higher, the extension no longer works properly and we at JetBrains have no intention to update the extension to work with the new Chrome versions. WebStorm 2020.3 removed the option to use the extension for debugging from the IDE Preferences. If chrome is your system's default browser, you can run a.html file in chrome from WebStorm, by right-clicking the file and selecting 13 & However, if you do NOT want chrome as your system's default browser, you can still tell WebStorm to use chrome. (see next slide) Setting Webstorm's Default Browser.
If you use Chrome for web browsing and want to debug in it simultaneously you can configure IntelliJ IDEA to use a separate Chrome user profile in ‘IDE Settings Browser Chrome‘:
Download IntelliJ IDEA 10.5 EAP, try the new JS debugger and let us know what you think.
Off-topic: debugging JS in FireFox 4 is supported since IntelliJ IDEA 10.0.3.
Jetbrains Ide Support Extension
Easy steps to setting up Live Edit (Hot Reload) in Webstorm and making your web development experience much smoother.
1. Create a new project
Create a new project in Webstorm and add an
index.html file we will use for our tests.
Insert some HTML code
and launch the page in your browser with the Chrome button on the top right of the html editing area in Webstorm.
2. Live Edit Setup
Good start ! Now let’s setup Live Edit in Webstorm so that anytime a change is made in Webstorm, the changes are automatically picked up by the browser.
a. Create a debug configuration
In the top right, click Edit Configurations to add a new configuration:
In the next screen:
- Click the
- Choose a name for your configuration, for examples Live Edit
- Click on the
...next to URL and select your
- Select Chrome in the Browser Dropdown 
- Click Apply
b. Launch the debug session
Click on little Bug icon next to your configuration on the top right, next to your configuration name.
If this your first time using Live Edit, Webstorm will ask you to install a Chrome Plugin
Click the link a proceed to install that plugin in Chrome.
Restart the debugging session from Webstorm and you are ready to go. Try to select elements in the .html file and see how any change has an immediate effect in Chrome.
c. Additional Configuration
At this point, everything is working great but you might find that sometimes some changes are not taken into account.
Go to Webstorm Settings and the Live Edit Section and use the following values:
Jetbrains Ide Support
- Update: auto - 15ms
- Check the ‘Restart if hotswap fails’ box.
Webstorm Chrome Debug Plugin