6

In my first steps, I'm using this not rational way, as described below:

  1. Create an HTML5 project to debug the JavaScript code.
  2. Create the definitive PHP project, with JS code already tested, where I debug the server side.

So I'm wondering if there is a smarter way of doing this?
E.g.: create a unique project and switch between native NetBeans JavaScript debugger and the (PHP) XDebug.

7
  • 1
    Why aren't you debugging the JavaScript in the browser? Commented Apr 4, 2013 at 2:25
  • 1
    Agree with @MattBall: you should be debugging JavaScript in the browser. You can use Firebug on Firefox or Chrome Developer Tools in Google Chrome Commented Apr 4, 2013 at 2:32
  • @MattBall, for laziness reasons... of coming back to NetBeans and edit the code, but it is the best way. Thanks for remember. Commented Apr 4, 2013 at 3:26
  • 1
    @MattBall: it can be more comfortable to debug AND modify (!) JavaScript code in NetBeans or another favourite IDE of yours. If you are used to write and debug codes in the IDE you configured to your taste (hotkeys, panels, etc.), why not using it? Commented Dec 28, 2013 at 0:57
  • 1
    @MattBall: it looks like you've never debugged JavaScript code with NetBeans - it's really simple and worth trying it. Here how to do it quickly: stackoverflow.com/a/20809988/517705. And the "added complexity" - which means only some minutes of reading+configuring - worth it. This way I can use the IDE I like for debugging and which I have configured, not the browser's inspector which can be a bit more uncomfortable than the IDE for such tasks. By the way, I admit that the browsers' tools are very smart, I also like and do use them, but like the IDE more for debugging purposes. Commented Dec 28, 2013 at 1:26

1 Answer 1

5

For JavaScript debugging in Chrome, you should use the official NetBeans Connector extension.

Here's an example on how to debug JavaScript code with NetBeans + Chrome + NetBeans Connector:

Debugging and Testing JavaScript in an HTML5 Application https://netbeans.org/kb/docs/webclient/html5-js-support.html

After creating a new project, you should "Confirm that Chrome with NetBeans Connector is selected in the dropdown list in the toolbar":

Confirm that Chrome with NetBeans Connector is selected in the dropdown list in the toolbar

(it looks like this in my NetBeans:
NetBeans Connector)

Put some breakpoints before some lines:

JS code breakpoints

and hit Run. After hitting Run, you will see a yellow warning bar which looks somehow like this, stating ""NetBeans Connector" is debugging this tab":

"NetBeans Connector" is debugging this tab

Do NOT open Chrome's built-in web inspector toolbar now (or you'll get a warning that this breaks the regular debugging process in NetBeans).

Now you can debug JavaScript code in NetBeans, the code will run in Chrome. You should open Window → Debugging → Variables panel to inspect the variables.

Or mouse over some items:

NetBeans JS code debugging; variable


Regarding debugging PHP code, here are some relevant official articles:

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

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.