Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.bricks.tools/llms.txt

Use this file to discover all available pages before exploring further.

BRICKS Foundation implements the Chrome DevTools Protocol (CDP), providing a frontend-like debugging experience for your applications. Connect via Chrome DevTools to inspect the DOM, debug JavaScript, profile performance, and view console logs. You can also connect CDP-supported tools like Puppeteer or Playwright to write automation scripts or connect via AI agents. An MCP endpoint is also provided for AI agent integration.

Enable DevTools on the device

1

Open advanced settings

On the device, open Settings and navigate to the advanced settings section.
2

Enable Chrome DevTools

Toggle Chrome DevTools on. The device starts a DevTools server on the local network on port 19851. If that port is already in use, it increments to the next available port.

Discover devices

Use the BRICKS CLI to scan your local network for devices with DevTools enabled:
bricks devtools scan
Devices must have Enable LAN Discovery turned on in advanced settings for network scanning to work. This is enabled by default.

DevTools endpoints

Once you find a device, use bricks devtools open with the --info flag to view all available endpoints:
bricks devtools open <device-address> --info
This displays connection URLs for:
EndpointDescription
Web UIOpen this URL in your browser to access the DevTools landing page
CDPChrome DevTools Protocol endpoint for direct connection
MCPModel Context Protocol endpoint for AI agent integration
MCP SSEMCP endpoint using Server-Sent Events transport
InfoJSON metadata endpoint at /devtools/info describing the device, version, and protocols
The output also includes the device passcode (when discovered) and the Authorization: Bearer <passcode> header required by the MCP and MCP SSE endpoints. Without --info, the command shows server identity (name, version, device ID, workspace, protocols, and authentication state).

Open the DevTools page

Open the Web UI URL in your browser to access the DevTools landing page. From there you can inspect the running application, view available debug targets, and connect to the device.

Connect with Chrome

You can also connect directly through Chrome:
  1. Enable Expose endpoints for chrome://inspect in advanced settings
  2. Open chrome://inspect in Chrome
  3. Your device appears in the list of remote targets
  4. Click inspect to open a DevTools window connected to the running application
Expose endpoints for chrome://inspect publishes the device’s /json endpoints without authentication so Chrome can discover them — which exposes the passcode in plain text. Only enable it for debugging on trusted networks.

Inspect via BRICKS CLI (CDP)

Requires BRICKS Foundation version 2.24 or later.
The BRICKS CLI provides CDP commands to inspect devices directly from the terminal — without opening a browser:
# Print the brick component tree
bricks devtools brick tree -a <device-address>

# Capture a screenshot
bricks devtools screenshot -a <device-address> -o screenshot.png

# Evaluate a JavaScript expression
bricks devtools runtime eval -a <device-address> "document.title"

# Monitor network activity
bricks devtools network list -a <device-address>
Use --passcode if the device requires authentication. See the CLI command reference for the full list of CDP commands.

What you can do with DevTools

With Chrome DevTools connected, you can:
  • Elements — Inspect and modify the rendered DOM
  • Console — View logs, warnings, and errors from the application
  • Sources — Debug JavaScript with breakpoints
  • Network — Monitor network requests made by generators
  • Performance — Profile rendering and script execution
  • Memory — Analyze memory usage and detect leaks

Next steps

Remote debugging

Debug devices remotely via BRICKS Controller without local network access.

Debug panel

Use the on-device overlay to inspect runtime state.