Format

Author: leonvogt

ARCHITECTURE.md

@@ -46,19 +46,16 @@ The goal is to align both parts and use a single source of truth for the state a
 **Component Responsibilities**
 
 1. **DevTools Panel**: The user interface shown in browser DevTools.
-
    - Built with Svelte
    - Communicates with background script via Chrome extension ports
    - Renders and updates based on events from the inspected page
 
 2. **Background Script**: Central coordination script that runs persistently.
-
    - Maintains connections between DevTools panel and proxy
    - Routes messages between components
    - Handles tab and lifecycle events
 
 3. **Proxy**: Content script injected into the page context.
-
    - Bridges the extension world and page world
    - Translates port-based communication to window.postMessage
    - Has access to DOM but not page JavaScript context

CLAUDE.md

@@ -52,6 +52,7 @@ Additionally, the extension has page-level features that work without opening De
 ### Backend Observers
 
 Each feature has a dedicated observer class in `src/page/observers/`:
+
 - `turbo_frame_observer.js` — tracks `<turbo-frame>` elements
 - `stimulus_observer.js` — tracks Stimulus controllers
 - `turbo_cable_observer.js` — tracks ActionCable subscriptions
@@ -62,6 +63,7 @@ All implement `matchElement()`, `elementMatched()`, `elementUnmatched()`.
 ### Message Types
 
 All message type constants live in `src/lib/constants.js`. Two directions:
+
 - `BACKEND_TO_PANEL_MESSAGES`: `SET_TURBO_FRAMES`, `SET_STIMULUS_DATA`, `TURBO_EVENT_RECEIVED`, etc.
 - `PANEL_TO_BACKEND_MESSAGES`: `HIGHLIGHT_ELEMENT`, `REFRESH_TURBO_FRAME`, `UPDATE_DATA_ATTRIBUTE`, etc.
 
@@ -84,6 +86,7 @@ $page/       → src/page/
 ### Svelte 5 Runes
 
 This project uses Svelte 5 rune syntax exclusively — no legacy Svelte 4 patterns:
+
 - `$state()` for reactive variables
 - `$props()` for component props
 - `$derived()` for computed values

build.js

@@ -37,16 +37,7 @@ const outputFileNames = {
 // Dev-only entry points (excluded from production builds)
 const devEntryPoints = ["./src/panel/dev.js"]
 
-const baseEntryPoints = [
-  "./src/page/content.js",
-  "./src/popup.js",
-  "./src/background.js",
-  "./src/page/inject_script.js",
-  "./src/panel/panel.js",
-  "./src/panel/register.js",
-  "./src/page/backend.js",
-  "./src/page/proxy.js",
-]
+const baseEntryPoints = ["./src/page/content.js", "./src/popup.js", "./src/background.js", "./src/page/inject_script.js", "./src/panel/panel.js", "./src/panel/register.js", "./src/page/backend.js", "./src/page/proxy.js"]
 
 const esbuildConfig = {
   entryPoints: production ? baseEntryPoints : [...baseEntryPoints, ...devEntryPoints],