title: Debugging Karma/Jasmine Tests with Angular 2 in WebStorm
body: <p>I'm trying to debug my Angular 2 Tests in WebStorm (2016.3.2). The first thing I tried was just to do it in Chrome Dev tools, but I actually don't see the script files in Sources to be able to set the break point. Note that you can see the script tags in the HTML page, but there's nothing in Sources.</p>
  
  <p><a href="https://i.stack.imgur.com/CaJ2l.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CaJ2l.png" alt="Chrome developer tools capture"></a></p>
  
  <p>So I did a bit more digging and found you can set up WebStorm to <a href="https://www.jetbrains.com/help/webstorm/2016.2/running-unit-tests-on-karma.html#d207666e171" rel="nofollow noreferrer">run and debug unit tests</a>.</p>
  
  <p>The tests do run, but the WebStorm breakpoint is never hit, and something seems to be "off" about what is happening. Obviously, I haven't used WebStorm before to run or debug unit tests, so I don't know what normal looks like.</p>
  
  <p><a href="https://i.stack.imgur.com/AVdeW.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/AVdeW.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/WqXAy.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WqXAy.png" alt="enter image description here"></a>
  <a href="https://i.stack.imgur.com/FlUrG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/FlUrG.png" alt="enter image description here"></a></p>
  
  <p>I'm sure I'm just missing something, but with so many unfamiliar technologies coming together, I'm not sure what thread to pull.</p>