![phpstorm debug javascript phpstorm debug javascript](https://confluence.jetbrains.com/download/attachments/51961408/nodejs-run-configuration-liveedit.png)
Now you easily debug your code and specs. Chrome will open and debug toolbar will show up:
![phpstorm debug javascript phpstorm debug javascript](https://devdocs.magento.com/common/images/phpstorm_phpunit_preferences_dialogue.png)
Start debugging by clicking Spider button next to Run (play) button. After that add break point in your spec or source file. You need to install Google Chrome browser with JetBrains plugin ( ). If the plugin is disabled, enable it on the Installed tab of the Settings/Preferences Plugins page, as described in Managing plugins. The JavaScript Debugger plugin is bundled with PhpStorm and activated by default. Press the + button and add a JavaScript Debug configuration. Alternatively, you can debug in Chrome by using a custom run configuration. While debugging JavaScript, we can use the Console tab to execute arbitrary JavaScript code within the execution context. Then, you should be able to set breakpoints in your JavaScript files in PhpStorm and debug them. One of them is the new Live Console in the PhpStorm JavaScript and Node.js debugger. Another way is by run menu (press ctrl + alt + r) and choosing your run configuration. Debugging JavaScript in PhpStorm is supported through the JavaScript Debugger plugin. Some features are so (seamingly) simple yet so powerful.
#PHPSTORM DEBUG JAVASCRIPT HOW TO#
How to rerun tests? Simplest way is to press keys ctrl + cmd + r. Plugin provides much more readable output rather than terminal: Now you should notice that your new configuration appeared in the dropdown at the navigation bar:Ĭlick green Play button. Everything else should be pre populated by IDE. In the run configurations windows add new Karma configuration:Ĭonfiguration is simple, fill the name (I chose RequireJS), specify path to Karma config file (in current example it’s ). Click on the drop down in the navigation bar: I’m going to work on my previous example.įirst thing first, let’s configure the Karma plugin. Today I’d like to move on and use the Karma inside the IDE instead of terminal. Before we start make sure you have installed & enabled Karma plugin and JavaScript debugger plugin in PhpStorm. Recently I wrote a post about configuring the Karma with RequireJS and PhantomJS ( ).