Skip to main content

Remote Debugging

Display Supra provides a combined debug mode for troubleshooting rendering, network, or JavaScript issues. One applet setting enables the Supra Screen debug overlay, the on-screen inspector, and Chromium DevTools access from another computer on the same local network.

Feature entitlement: supraOnPremise ยท Plan: ๐Ÿ‘‘ Add-on โ€” not in a standard Device Plan
danger

Remote debugging provides full control over Display Supra's browser session. Enable it only on a trusted, isolated network, block the selected debug port from untrusted networks, and disable debug mode after troubleshooting.

Enable Debug Modeโ€‹

Add the following configuration to the applet timing:

Configuration keyValueDescription
supraenabledActivates Supra mode
supraDsn?debug=1Enables all Supra debugging tools

Setting via Boxโ€‹

  1. Navigate to the client device's detail page in Box.
  2. Open the Applets tab.
  3. Enable Supra for the target applet.
  4. Set supraDsn to ?debug=1 in the applet's timing configuration.
  5. Wait for the updated timing to start.

Setting via APIโ€‹

When creating or updating a timing through the signageOS REST API, include:

{
"configuration": {
"supra": "enabled",
"supraDsn": "?debug=1"
}
}

Display Supra normally uses TCP port 9222. If another Display Supra process on the same host already uses that port, it automatically tries 9223, then following ports. Different Supra devices do not conflict because each has a different IP address.

For a fixed port, append debugPort:

{
"configuration": {
"supra": "enabled",
"supraDsn": "?debug=1&debugPort=9225"
}
}

Use a fixed port when firewall rules require one or several Display Supra processes share a host. The selected port is available in the Display Supra log.

Connect from Chromeโ€‹

  1. Connect your workstation to the same trusted LAN as the Supra host.
  2. Allow inbound TCP traffic to the selected debug port from your workstation.
  3. Open chrome://inspect/#devices in Chrome.
  4. Select Configure... next to Discover network targets.
  5. Add <SUPRA_IP>:<DEBUG_PORT>, for example 192.168.1.50:9222.
  6. Select Done.
  7. When the Display Supra renderer appears under Remote Target, select inspect.
note

Chrome lists each debuggable page and background worker separately, so seeing several targets is expected:

  • A target named after your applet opens its renderer. Select this target to debug the applet.
  • DevTools targets represent open DevTools frontends, including the on-screen inspector. DevTools is itself a web page, so Chrome also lists it as an inspectable target.
  • Service Worker represents the applet's background worker, used for features such as request handling and caching.

More than one applet target can appear when Supra uses multiple windows. Use the target title and URL to identify the applet instance you want to debug.

If no target appears, open http://<SUPRA_IP>:<DEBUG_PORT>/json/list in Chrome. If it is unreachable, verify the selected port in the Display Supra log, host IP, firewall, and network isolation.

Disable Debug Modeโ€‹

Remove debug=1 from supraDsn and restart the timing. Confirm that the debug overlay and on-screen inspector disappear and the debug port is no longer reachable.