Sumeru Docs ← Sumeru
Pre-alpha. No tagged release and no upgrade path between versions. Use for evaluation and development only, not production.
Core DevPre-alpha

SWC Vision devtools

SWC ships developer tools for inspecting components, templates, and workspace payloads at runtime.

Components

PieceLocationPurpose
Devtools bridgecore/swc/src/devtools/bridge.tsConnects page to inspector
In-app panelcore/swc/src/devtools/debug.tsLightweight arch/payload log
Browser extensioncore/swc/devtools-extension/Full component tree + render profiler

In-app debug panel

Enabled on workspace pages after SWC bootstrap. Logs workspace payload and view arch via logWorkspacePayload / logViewArch when debug mode is active.

Browser extension

Build:

cd sumeru/core/swc
npm run build:extension

Load unpacked extension from devtools-extension/ in Chrome/Edge:

  1. Open chrome://extensions
  2. Enable Developer mode
  3. Load unpacked → select core/swc/devtools-extension/
  4. Open a Sumeru workspace tab
  5. Open DevTools → SWC Vision panel

Features:

  • Component tree for mounted SWC views
  • Template navigator
  • Render profiler (extension panel)

Workspace debugging tips

  1. Network tab: Inspect GET /web/swc/workspace response for arch JSON and records.
  2. View tabs: Breadcrumb view switcher syncs via SPA; URL params drive view_type and id.
  3. RPC: All saves go through POST /api/rpc with X-CSRF-Token.
  4. Tests: Run make swc-test for widget and view regression tests.

See also

Sumeru is pre-alpha (no tagged release, no upgrades). Part of Project Meru.