Setting up JS debugging with IntelliJ/WebStorm and PhantomJS/Casper

casperjs, intellij-idea, javascript-debugger, phantomjs, webstorm

Solution

PhantomJS has a `remote-debugger-port` option you can use to debug your casper script in Chrome dev tools. To use it, simply execute your casper script with this argument:

`casperjs test script.js --remote-debugger-port=9000`

Then, open up http://localhost:9000 in Chrome and click on the `about:blank` link that presents itself. You should then find yourself in familiar Chrome dev tools territory.

Since this is a script and not a web page, in order to start debugging, you have to do one of two things before your script will execute:

- In the Chrome dev tools page, open the console and execute `__run()` to actually start your script.

- Insert a `debugger;` line in your code, and run your casper script with an additional `--remote-debugger-autorun=yes` argument. Doing so with the remote debug page open will run the script until it hits your `debugger;` line.

There's a great tutorial that explains this all very nicely.

Problem

Original source