Thursday, November 5, 2015

Debugging Dart web app with WebStrom

Debugging a Dart application is pretty much easy with WebStrome IDE. But there are several steps to follow

  • Install  JetBrains Chrome Extension (Later need to setup by providing the correct port and ip)
  • Open the web application with webstrome by clicking on the html page's browser icon (top right corner)
    •  





  • Most probably it'll open with host=>127.0.0.1 & port => 63343
  • Right click top of the JetBrains Chrome Extension -> Options

  • Change the Host and Port values and apply the changes
  • Now It's time to setup the Javascript Debugger in webstrom go to Run -> Debug -> Edit Configuration
  • Add Javascript Debugger with + icon
  • Add the web page URL to debug configurations
  • Ok Done ! Lets test a sample app and see
  • Make a break point anywhere in dart source code
  • Simply go to Run -> Debug Dart_Debug (in this case I gave this name)
  • It'll open the web application with new tab, when it'll hit the brakpoint it should work
    • Whoo Hoo !!!