Debugging with webstorm and karma

I think this is not mentioned in Vojta’s testacular video, or maybe I missed it, but i had to install JetBrain’s chrome debugger plugin to be able to debug tests run with Karma in Webstorm.

The steps i used to get it to work:

  • Install chrome Jetbrains IDE support plugin
  • Configure a Karma Server run configuration in Webstorm: Webstorm Karma Server run configuration
  • Configure a Karma debug configuration in Webstorm: Webstorm Karma debug configuration
  • Run Karma server Webstorm Karma Server run
  • Run Karma debug Webstorm Karma debug run

Small example

Create project folder

npm install -g karma
mkdir test-karma
cd test-karma
mkdir app
mkdir app/js
mkdir app/lib
cp <angular library> app/lib/angular.min.js
mkdir config
mkdir test
mkdir test/unit

Edit app/index.html

<!doctype html>
<html ng-app>
	    <title>Hello World</title>
	    <script src="lib/angular.min.js"></script>
	    <script src="js/app.js"></script>
	<body ng-controller="HelloWorldCtrl">
	    <p>Hello </p>
	    <input id="name" name="name" type="text" ng-model="name" 
	           placeholder="What's your name?"/>
	     <a href="#" ng-click="reset();">Reset</a>

Edit app/js/app.js

function HelloWorldCtrl($scope) {
	$scope.reset = function(){
	    $ = "";

Edit test/unit/HelloWorldCtrlSpec.js

describe('HelloWorld controller',function(){
	it('Should reset name value',function(){
		var scope = {},
			ctrl = new HelloWorldCtrl(scope); = "john";

Create a karma configuration file:

$> karma init config/karma.conf.js

    Which testing framework do you want to use ?
    > jasmine
    Do you want to use Require.js ?
    > no
    Do you want to capture a browser automatically ?
    > Chrome
    Which files do you want to test ?
    > test/**/*Spec.js
    Any files you want to exclude ?
    Do you want Testacular to watch all the files and run the tests on change ?
    > yes
    Config file generated at "/home/akoelewijn/projects/training-angularjs/test-karma/config/karma.conf.js".
blog comments powered by Disqus