Both WebStorm 2.0 and PhpStorm 2.0 allow you to debug JavaScript code while running it in Mozilla Firefox (including Firefox 4).
In WebStorm 2.1 and PhpStorm 2.1, which are currently in early production access, you can also choose to debug JavaScript in Google Chrome.
Looks like WebStorm and the Developer Tools uses the same API of Chrome and it cannot be used from two processes simultaneously. Konstantin Azarov says: February 13, 2012.
Debugger for Chrome supports all features of JavaScript debugger for Firefox. You can set breakpoints, inspect local variables, evaluate expressions and more:
On the Live Edit page that opens, select the Update application in Chrome on changes in checkbox. By default, WebStorm shows on-the-fly preview only for HTML and CSS code. To enable Live Edit in JavaScript, select the JavaScript, HTML and CSS option. Place WebStorm and Chrome on your screen in such a way that you can see both applications to take advantage of Live Edit instant changes. Click the Debug button to run a JavaScript Debug Session or use Inspect in IDE action. From now on, any changes you perform will be instantly shown in Google Chrome browser without a page reload.
Chrome Webstorm Debug
If you use Chrome for web browsing and want to debug in it simultaneously, you can configure WebStorm or PhpStorm to use a separate Chrome user profile in ‘IDE Settings | Web Browsers | Chrome‘:
To configure the default debugging browser, just edit the ‘JavaScript Debug’ configuration in the ‘Defaults’ section.
Webstorm Chrome Console
Download WebStorm/PhpStorm EAP, try the new JS debugger and let us know what you think.
Jetbrains Ide Support
Develop with pleasure!
-JetBrains Web IDE Team