Debugging AngularJS End to End Tests in Intellij IDEA using Protractor

I have started using Protractor to run my end to end (e2e) tests for AngularJS, but information on how to debug in an IDE is somewhat sparse being this is such a new framework. After some tinkering I have breakpoints working!

If you need to debug your e2e tests in IntelliJ IDEA (also Webstorm will be similar) you need to do the following:

  1. You will need to be using NPM to manage your dependencies (like grunt, bower, yeoman, etc.). If you aren’t, you should seriously consider looking into it as it simplifies JS development immensely.
  2. If you haven’t already done so, install the Node.js IntelliJ IDEA plugin. You can do this via the plugins browser within IDEA.
  3. In your project, add a new debug configuration for Node.js
  4. If not pre-populated, enter your path to your node installation. It should be something like ‘~/.nvm/v0.10.12/bin/node’
  5. Update your working directory to the root of your Angular app, i.e. where you would run your Protractor tests from the command line.
  6. Enter the path to your protractor cli.js file (relative to your working directory). e.g. ‘node_modules/protractor/lib/cli.js’
  7. For the application parameter, enter your protractor config file, e.g. test/protractor.conf.js

Debugging will run the tests and pause at any breakpoints set in IntelliJ!