Debugging PHP and JavaScript code at the same time

Posted on by

When developing PHP applications for the web, chances are we’re also using a good amount of JavaScript with it. Using PhpStorm, we can debug the PHP code running on the server and inspect what is happening while it’s running. We can also debug the JavaScript running in the browser by starting a JavaScript debugging session from our IDE. But what if we want to do both at the same time? Is that even possible? Well, yes, it is! Here’s how.

The first thing we want to do is listen for incoming PHP debug connections. Toggle the Listen for PHP Debug Connections button in the toolbar so PhpStorm will react on incoming connections from Xdebug or Zend Debugger.

Next, we can start a JavaScript debug session from the context menu: Debug | somefile.php will launch the browser with the JavaScript debugger enabled. We can then use the PhpStorm debugger bookmarklets or one of the Browser Debugging Extensions to start a PHP debugging session from the same browser window. And then, magic happens! PhpStorm will let us debug both JavaScript and PHP at the same time! The IDE will switch between the debuggers as necessary.

Learn more about how to debug JavaScript and PHP simultaneously in PhpStorm in our tutorial. Don’t have PhpStorm yet? Give the latest PhpStorm 8 EAP a go. Your feedback is welcome through the issue tracker, by posting in the comments below, or in our forums!

Develop with pleasure!

– JetBrains PhpStorm Team