4

I'm trying to debug some controller code in an Angular application in WebStorm using Google Chrome.

My Debug Settings :

My Debug Settings

When running theses Debug settings :

1) Chorme flickers in the Taskbar as if it is trying to connect.

2) I don't see the Debugging Tab (Indication) usually shown at the top of the page (like a brownish header)

3) In WebStorm's Debugger window i get the following message 

 "cannot connect , ensure that Web Inspector is closed "

Debugger window message

Additionally I was able to debug my code using Chrome development tools.

Any idea what is interfering the Webstorm's Debugger from connecting to Chrome ?

Improve this question
8
  • WebStorm and Chrome versions? Commented Oct 11, 2014 at 19:02
  • Webstorm 7 . I'm not sure the exact version of chrome . but i installed it not long ago on Windows 7 64 bit Commented Oct 11, 2014 at 19:11
  • In Chrome -- Menu (burger icon) | About Google Chrome ? Commented Oct 11, 2014 at 19:16
  • In any case: Chrome has recently (v37) updated their protocols .. which made WebStorm v8 incompatible (and you are using even older version). So either try v9 EAP build or downgrade Chrome to v36 (e.g. install it separately, disable auto-updates and use it for development only). v9 EAP -- see blog.jetbrains.com/webstorm/2014/10/… Commented Oct 11, 2014 at 19:18
  • Ok thanks , i just started using Firefox instead . Commented Oct 11, 2014 at 19:28

3 Answers 3

Reset to default
3

Have you installed "JetBrains IDE Support" extension for chrome? if your web server is running in localhost:63342, try:

  1. Setting the URL parameter to http:// localhost:63342
  2. Bind your index.html file to http:// localhost:63342/index.html

If you have any question, please have a look to this post which describes how to debug Angular with Intellij, step by step: http://ignaciosuay.com/how-to-debug-angularjs-with-intellij/

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

I encounter the same problem as you,but I have find the solution.You just lack a simple but important step,which is Overriding the default CORS settings.You can follow:

  1. Right-click the JetBrains Chrome extension icon and choose Options on the context menu. A web page with Chrome extension options opens showing the parameters to connect to WebStorm.
  2. Change the port which you can find in your WebStorm.Then,you can debug your AngularJS app in the Chrome.

You also can see https://www.jetbrains.com/webstorm/help/using-jetbrains-chrome-extension.html

Improve this answer

Comments

0

first check Jetbrains IDE Support install on your chrome then right click on icon go to option check port, I use routing in my angular application for this reason in URL of webstorm javascript debug not selected the specific html file just for example (http://localhost:63342/sampleproject/) write on urlbox then breakpoint in controllers worked . this solution worked for me

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.