Debug Javascript in netbeans 7.4 inside PHP project

3
votes

I want to debug javascript code inside my php project in netbeans. I have read on several occasions that this should be possible in the new netbeans 7.4 version, for example here and here, but i cannot get it to work. I have installed de debugger connector for chrome and php debugging works just fine but when i try to set a breakpoint in a .js file it says:

unresolved breakpoint,

debugger is not attached to tab with id....

i understand that the link from the netbeans page is for an html 5 application but i thought this debugging would also be enabled in php projects. Am i doing something wrong?

i know i can debug with firebug or chrome itself but i would like to do it all in one place in my netbeans IDE...

thanks in advance

3
javascriptphpdebuggingnetbeans
You can do this with firebug in Firefox or Google chromes inspector. Im not sure whether it can be done within Netbeans, but JS and PHP app/sites are usually on a web server and accessible through a browser - mic
as i stated in my last part i understand this can be done from several browsers and plugins for these browsers such as firebug. I read however that this would also be possible within netbeans and i would like it if i can everything from within this IDE. Also i am developing the web system and have locak xampp config running as wel as a dedicated production environment so access is not a problem - user2988167

3 Answers

1
votes

The unresolved breakpoint usually mean that for instance you set it in file that is not loaded in Chrome's tab right now (or for some reason, IDE cannot match URL of JS file and local JS file). The mixed debugging works only in Embdded Browser or in Chrome with NetBeans connector (you can see the usually yellow bar in your page saying "NetBeans connector is debugging this page" and you can debug PHP and JS at the same time.

Have a look here, although it is about Java EE projects, it is very similar to PHP projects

Updated answer:

One issue I remember (and plain Chrome Dev Tools has it as well) is that if you have JavaScript file attached to HTML/PHP with dynamic parameter to prevent browser from caching, e.g. , where "673612" changes each time a file is loaded. If that's your case, try to remove this dynamic attribute. I think that e.g. Sencha or ExtJS use this feature which "breaks" debuggers.

0
votes

I had a similar problem : javascript breakpoints were broken, while everything else was working fine (for example php breakpoints were okay).

The reason was that in the run configuration properties I changed the Project URL to something that was not the host anymore, but a subfolder managed by a url rewriting rule.

0
votes

johanvs is correct, but my reputation is not enough to +1.

Suppose a NetBeans project contains many files in different folders:

/var/www/index.html
/var/www/config.html
/usr/doc/readme.txt
/usr/doc/license.txt

Since "index.html" is not in the project root folder but under "/var/www", NetBeans does not know "http://127.0.0.1/index.html" is corresponding to "/var/www/index.html". To solve, verify below settings in NetBeans -> File -> Project Properties:

  1. Sources -> Web Root

    "var/www"

  2. Run Configuration -> Project URL

    "http://127.0.0.1/"

  3. Run Configuration -> Index File -> Browse

    "index.html"

  4. Run Configuration -> Remote Connection -> Manage -> Initial Directory

    "/"

  5. Run Configuration -> Upload Directory

    (empty)