title: Debugging with chrome with es6
body: <p>I am trying to use Ecmascript 2015 for my project and I am finding it hard to add breakpoints at specific places (places I thought was logical to have a breakpoint). </p>
  
  <p>I have #enable-javascript-harmony flag in chrome set to true (if that helps), but I am using babeljs to transpile and have sourcemaps to directly set breakpoints in the file that I want to debug. I am most certain that I am doing something wrong but can somebody point me where I am making mistake. </p>
  
  <p>For reference I have added a GIF of what I am talking about. </p>
  
  <p><a href="https://i.stack.imgur.com/cwWdb.gif" rel="noreferrer"><img src="https://i.stack.imgur.com/cwWdb.gif" alt="enter image description here"></a></p>