How to debug jweb issues?

Devbeginneradvancedbugs/issues
F S's icon

F S

Hi there,

Is there a way to debug issues (for example: get console logs like we do in web browser) on jweb? It doesn't look as easier to find logs on Max Runtime for anything inside of jweb. Anything on this will be appreciated.

Thanks!

Florian Demmer's icon

Florian Demmer

Hi!

It's possible using Remote Debugging. To enable it

  1. Open the Max Preferences

  2. Search for Remote and see the preference for Remote Debugging Port

  3. You can set a port that jweb will use to to enable debugging of - eg. 47474

To then debug the contents of the site served by a jweb instance you can use Chrome by navigating to chrome://inspect/#devices

F S's icon

F S

Thanks for the help on this. Appreciate it.


For anyone looking into it in the future, don't forget to restart the Max App so the remote connection is built. The info on Remote Debugging Port gives more details on this as well. Thanks!

midinerd's icon

midinerd

Whoa, very nice.

So - you go to Options > Preferences ....

Scroll down to jweb > Remote Debugging Port : Add a port# of your choice, i.e. 4747 or above

Navigate to the above mentioned URL in Chrome:

- chrome://inspect/#devices

Under Devices, next to [checkbox] Discover Network Targets click on Configure...

- I added localhost:4747 where 4747 is the port you entered in Max's jweb Remote Debugging Port jus to be sure. Maybe that isn't necessary.

It may take a moment for the targets in the Chrome UI to update. As in several seconds. Be patient.

Eventually you should see a section underneath, Remote Target populated with a new entry following the likes of:

Target (<IP Address....>) [Open tab with Url] <Clickable Open Button> trace

with some other options below.

I think I had to click 'inspect' beneath there to get a tab open - pop open the 'sources' tab and navigate to your given code, add a breakpoint, interact with the jweb content in Max - you should hit the breakpoint per normal debugging.

sounds nice -hector

Aside from typical failures blocking js functionality, I have this little helper method to detect if it's running in max, or in chrome, and to defer debug output to chrome's console or out of the jweb first inlet:

function echoToMax(msg) {
  if ((window.max != undefined) && (window.max.outlet) != undefined ) {
      window.max.outlet(msg);
  }
  else{
      console.log(msg);
  }
}


Peng! You can attach with VSCode as well, the following configuration worked:

{
    "configurations": [
    {
        "name": "Attach to Max",
        "url": "file:///G:/path/to/my/jweb.html",
        "port": 4747,
        "request": "attach",
        "type": "chrome",
        "webRoot": "${workspaceFolder}"
    }
    ]
}

my life is #potato