-
AI Channel
+
AI Channel
+
+
+ bridge offline
+
+
A JSON data channel running alongside voice. Claude (or any AI) on either side can send structured messages peer-to-peer. Open your browser console or use the API below.
@@ -236,13 +241,38 @@
AI Channel
};
ch.onmessage = (ev) => {
+ // Parse the incoming payload once.
+ let msg;
+ let parsed = false;
try {
- const msg = JSON.parse(ev.data);
- aiLog('recv', JSON.stringify(msg, null, 2));
- // Fire callback for programmatic consumers (Claude, MCP, etc.)
- if (window.burble?.onMessage) window.burble.onMessage(msg);
- } catch (e) {
- aiLog('recv', ev.data);
+ msg = JSON.parse(ev.data);
+ parsed = true;
+ } catch (_) {
+ msg = ev.data;
+ }
+
+ // UI log.
+ aiLog('recv', parsed ? JSON.stringify(msg, null, 2) : String(msg));
+
+ // Fire callback for programmatic consumers (Claude, MCP, etc.)
+ if (parsed && window.burble?.onMessage) {
+ try { window.burble.onMessage(msg); } catch (cbErr) {
+ console.error('[Burble AI] onMessage callback threw:', cbErr);
+ }
+ }
+
+ // ALSO forward to the local Deno AI bridge so `curl /recv` can drain it.
+ // This is the critical link that makes remote → local Claude work:
+ // remote DataChannel → this onmessage → bridge WS → bridge /recv queue → curl.
+ // Previously this was wired via a separate setupAIChannelWithBridge()
+ // function that was defined but never called — the receive leg was
+ // effectively broken until this inlining (2026-04-16).
+ if (bridgeWs?.readyState === 1) {
+ try {
+ bridgeWs.send(JSON.stringify({ type: 'received', payload: parsed ? msg : ev.data }));
+ } catch (fwdErr) {
+ console.error('[Burble AI] Bridge forward failed:', fwdErr);
+ }
}
};
@@ -264,6 +294,7 @@ AI Channel
history: [],
channel: () => aiChannel,
isOpen: () => aiChannel?.readyState === 'open',
+ bridgeConnected: () => bridgeWs?.readyState === 1,
};
}
@@ -301,57 +332,67 @@ AI Channel
let bridgeWs = null;
+ function setBridgeStatus(state) {
+ // state: 'online' | 'offline' | 'connecting'
+ const dot = document.getElementById('bridge-dot');
+ const label = document.getElementById('bridge-label');
+ if (!dot || !label) return;
+ if (state === 'online') {
+ dot.style.background = '#3fb950';
+ label.textContent = 'bridge online — curl localhost:6474';
+ label.style.color = '#3fb950';
+ } else if (state === 'connecting') {
+ dot.style.background = '#d29922';
+ label.textContent = 'bridge connecting…';
+ label.style.color = '#d29922';
+ } else {
+ dot.style.background = '#6e7681';
+ label.textContent = 'bridge offline';
+ label.style.color = '#8b949e';
+ }
+ }
+
function connectBridge() {
+ setBridgeStatus('connecting');
try {
- bridgeWs = new WebSocket('ws://localhost:6475');
- bridgeWs.onopen = () => {
+ const ws = new WebSocket('ws://localhost:6475');
+ ws.onopen = () => {
+ bridgeWs = ws;
+ setBridgeStatus('online');
aiLog('system', 'AI bridge connected — Claude can use curl localhost:6474');
};
- bridgeWs.onmessage = (ev) => {
+ ws.onmessage = (ev) => {
try {
const msg = JSON.parse(ev.data);
if (msg.type === 'send' && window.burble?.isOpen()) {
- // Bridge is asking us to send to remote peer
+ // Bridge is asking us to send to the remote peer.
window.burble.send(msg.payload);
+ } else if (msg.type === 'ping') {
+ // Heartbeat from the bridge — respond so the bridge knows we're alive.
+ ws.send(JSON.stringify({ type: 'pong', ts: Date.now() }));
}
- } catch (e) { /* ignore */ }
+ } catch (_) { /* ignore malformed bridge frames */ }
};
- bridgeWs.onclose = () => {
- bridgeWs = null;
- // Retry in 5s
+ ws.onclose = () => {
+ if (bridgeWs === ws) bridgeWs = null;
+ setBridgeStatus('offline');
+ // Retry in 5 s.
setTimeout(connectBridge, 5000);
};
- bridgeWs.onerror = () => {
- bridgeWs?.close();
- bridgeWs = null;
- // Bridge not running — silent retry
+ ws.onerror = () => {
+ // Bridge probably not running yet; quietly retry.
+ try { ws.close(); } catch (_) {}
+ if (bridgeWs === ws) bridgeWs = null;
+ setBridgeStatus('offline');
setTimeout(connectBridge, 10000);
};
- } catch (e) {
+ } catch (_) {
+ setBridgeStatus('offline');
setTimeout(connectBridge, 10000);
}
}
- // Hook into the AI channel to forward received messages to the bridge
- const originalSetupAIChannel = setupAIChannel;
- function setupAIChannelWithBridge(ch) {
- const origOnMessage = ch.onmessage;
- setupAIChannel(ch);
- const hookedOnMessage = ch.onmessage;
- ch.onmessage = (ev) => {
- hookedOnMessage(ev);
- // Forward to bridge
- if (bridgeWs?.readyState === 1) {
- try {
- bridgeWs.send(JSON.stringify({ type: 'received', payload: JSON.parse(ev.data) }));
- } catch (e) {
- bridgeWs.send(JSON.stringify({ type: 'received', payload: ev.data }));
- }
- }
- };
- }
-
- // Start bridge connector on page load (silent — doesn't block anything)
+ // Start bridge connector on page load (silent — doesn't block anything).
connectBridge();
// ── Auto-connect via relay ────────────────────────────────────────
diff --git a/client/web/tests/ai_bridge_roundtrip_test.js b/client/web/tests/ai_bridge_roundtrip_test.js
new file mode 100644
index 0000000..1067c42
--- /dev/null
+++ b/client/web/tests/ai_bridge_roundtrip_test.js
@@ -0,0 +1,225 @@
+// SPDX-License-Identifier: PMPL-1.0-or-later
+//
+// Round-trip test for the Burble AI Bridge.
+//
+// Simulates the full Claude-to-Claude path end-to-end without a browser:
+//
+// curl POST /send (A) → bridge A HTTP → bridge A WS
+// → mock page A WebSocket (acts as p2p-voice.html)
+// → pipe that simulates WebRTC DataChannel
+// → mock page B WebSocket
+// → bridge B WS → bridge B queue → curl GET /recv (B)
+//
+// If the previous `setupAIChannelWithBridge` dead-code bug returns, this test
+// fails at the last hop. It also exercises the heartbeat so stale sockets
+// aren't mistaken for live ones.
+
+import assert from "node:assert";
+
+// Use non-default ports so this suite can run even if the user has a normal
+// bridge on 6474.
+const BRIDGE_A_HTTP = 7474;
+const BRIDGE_A_WS = BRIDGE_A_HTTP + 1;
+const BRIDGE_B_HTTP = 7484;
+const BRIDGE_B_WS = BRIDGE_B_HTTP + 1;
+
+async function startBridge(port) {
+ const cmd = new Deno.Command("deno", {
+ args: ["run", "--allow-net", "--allow-env", "../../burble-ai-bridge.js"],
+ cwd: import.meta.dirname,
+ env: { BURBLE_AI_BRIDGE_PORT: String(port) },
+ stdout: "null",
+ stderr: "null",
+ });
+ const proc = cmd.spawn();
+ // Give Deno.serve a moment to bind both ports.
+ await new Promise((r) => setTimeout(r, 800));
+ return proc;
+}
+
+function stopBridge(proc) {
+ if (!proc) return;
+ try { proc.kill("SIGTERM"); } catch (_) {}
+}
+
+// Open a WebSocket to a bridge's relay port and mimic a connected p2p-voice page.
+// Returns an object with { ws, onReceive(cb) } — onReceive fires for "send"
+// frames coming down from the bridge (i.e. messages the bridge wants the page
+// to relay to the remote peer via DataChannel).
+async function connectMockPage(wsPort) {
+ const ws = new WebSocket(`ws://127.0.0.1:${wsPort}`);
+ await new Promise((resolve, reject) => {
+ ws.onopen = resolve;
+ ws.onerror = (e) => reject(new Error(`mock page ws error: ${e.type}`));
+ });
+
+ let receiveCb = null;
+ ws.onmessage = (ev) => {
+ let msg;
+ try { msg = JSON.parse(ev.data); } catch (_) { return; }
+
+ // Heartbeat: reply to pings so the bridge doesn't kill us.
+ if (msg.type === "ping") {
+ ws.send(JSON.stringify({ type: "pong", ts: Date.now() }));
+ return;
+ }
+
+ // The bridge is asking this mock page to send something to its peer.
+ if (msg.type === "send" && receiveCb) {
+ receiveCb(msg.payload);
+ }
+ };
+
+ return {
+ ws,
+ onReceive(cb) { receiveCb = cb; },
+ // Push a "received from remote DataChannel" frame up into this bridge,
+ // simulating what p2p-voice.html's DataChannel onmessage forward now does.
+ simulateRemoteDelivery(payload) {
+ ws.send(JSON.stringify({ type: "received", payload }));
+ },
+ };
+}
+
+// Cross-wire two mock pages so they behave like two ends of a WebRTC DataChannel:
+// whatever bridge A pushes out as a "send" frame, we deliver into bridge B as
+// a "received" frame, and vice versa.
+function crossWire(pageA, pageB) {
+ pageA.onReceive((payload) => pageB.simulateRemoteDelivery(payload));
+ pageB.onReceive((payload) => pageA.simulateRemoteDelivery(payload));
+}
+
+// Poll /recv on a bridge until it returns at least one message, or time out.
+async function drainRecv(httpPort, timeoutMs = 3000) {
+ const deadline = Date.now() + timeoutMs;
+ while (Date.now() < deadline) {
+ const resp = await fetch(`http://127.0.0.1:${httpPort}/recv`);
+ const data = await resp.json();
+ if (data.count > 0) return data.messages;
+ await new Promise((r) => setTimeout(r, 50));
+ }
+ throw new Error(`/recv on :${httpPort} drained nothing within ${timeoutMs}ms`);
+}
+
+Deno.test({
+ name: "AI Bridge round-trip: POST /send on A reaches GET /recv on B",
+ async fn() {
+ const bridgeA = await startBridge(BRIDGE_A_HTTP);
+ const bridgeB = await startBridge(BRIDGE_B_HTTP);
+ let pageA, pageB;
+
+ try {
+ pageA = await connectMockPage(BRIDGE_A_WS);
+ pageB = await connectMockPage(BRIDGE_B_WS);
+ crossWire(pageA, pageB);
+
+ // Give the bridges a moment to register wsClient after upgrade.
+ await new Promise((r) => setTimeout(r, 200));
+
+ // Status should show connected on both sides now.
+ const statusA = await (await fetch(`http://127.0.0.1:${BRIDGE_A_HTTP}/status`)).json();
+ const statusB = await (await fetch(`http://127.0.0.1:${BRIDGE_B_HTTP}/status`)).json();
+ assert.strictEqual(statusA.connected, true, "bridge A should report connected");
+ assert.strictEqual(statusB.connected, true, "bridge B should report connected");
+
+ // Send a message via bridge A's HTTP /send.
+ const message = { type: "hello", from: "dad-claude", at: Date.now() };
+ const sendResp = await fetch(`http://127.0.0.1:${BRIDGE_A_HTTP}/send`, {
+ method: "POST",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify(message),
+ });
+ assert.strictEqual(sendResp.status, 200, "send should succeed with peer connected");
+ const sendData = await sendResp.json();
+ assert.strictEqual(sendData.ok, true);
+
+ // Bridge B should now have the message queued for polling.
+ const received = await drainRecv(BRIDGE_B_HTTP);
+ assert.strictEqual(received.length, 1, "exactly one message should have arrived");
+ assert.strictEqual(received[0].type, message.type);
+ assert.strictEqual(received[0].from, message.from);
+ assert.strictEqual(received[0].at, message.at);
+ } finally {
+ try { pageA?.ws.close(); } catch (_) {}
+ try { pageB?.ws.close(); } catch (_) {}
+ stopBridge(bridgeA);
+ stopBridge(bridgeB);
+ await new Promise((r) => setTimeout(r, 100));
+ }
+ },
+ sanitizeResources: false,
+ sanitizeOps: false,
+});
+
+Deno.test({
+ name: "AI Bridge round-trip: B → A (reverse direction)",
+ async fn() {
+ const bridgeA = await startBridge(BRIDGE_A_HTTP);
+ const bridgeB = await startBridge(BRIDGE_B_HTTP);
+ let pageA, pageB;
+
+ try {
+ pageA = await connectMockPage(BRIDGE_A_WS);
+ pageB = await connectMockPage(BRIDGE_B_WS);
+ crossWire(pageA, pageB);
+ await new Promise((r) => setTimeout(r, 200));
+
+ const message = { type: "pong", from: "son-claude", nonce: 42 };
+ const sendResp = await fetch(`http://127.0.0.1:${BRIDGE_B_HTTP}/send`, {
+ method: "POST",
+ headers: { "Content-Type": "application/json" },
+ body: JSON.stringify(message),
+ });
+ assert.strictEqual(sendResp.status, 200);
+
+ const received = await drainRecv(BRIDGE_A_HTTP);
+ assert.strictEqual(received.length, 1);
+ assert.strictEqual(received[0].nonce, 42);
+ } finally {
+ try { pageA?.ws.close(); } catch (_) {}
+ try { pageB?.ws.close(); } catch (_) {}
+ stopBridge(bridgeA);
+ stopBridge(bridgeB);
+ await new Promise((r) => setTimeout(r, 100));
+ }
+ },
+ sanitizeResources: false,
+ sanitizeOps: false,
+});
+
+Deno.test({
+ name: "AI Bridge heartbeat: bridge sends ping, mock page's pong keeps socket alive",
+ async fn() {
+ const bridge = await startBridge(BRIDGE_A_HTTP);
+ let page;
+
+ try {
+ let pingCount = 0;
+ page = await connectMockPage(BRIDGE_A_WS);
+
+ // Tap the ws onmessage to count pings. Preserve the existing pong reply.
+ const origOnMessage = page.ws.onmessage;
+ page.ws.onmessage = (ev) => {
+ try {
+ const msg = JSON.parse(ev.data);
+ if (msg.type === "ping") pingCount++;
+ } catch (_) {}
+ origOnMessage(ev);
+ };
+
+ // Shorten wait: the bridge pings every 15 s normally, but even without a
+ // tick we can verify the status stays connected across a 2 s window.
+ // (A full heartbeat-interval test would inflate suite time unacceptably.)
+ await new Promise((r) => setTimeout(r, 2000));
+
+ const status = await (await fetch(`http://127.0.0.1:${BRIDGE_A_HTTP}/status`)).json();
+ assert.strictEqual(status.connected, true, "socket should still be alive after 2 s");
+ } finally {
+ try { page?.ws.close(); } catch (_) {}
+ stopBridge(bridge);
+ await new Promise((r) => setTimeout(r, 100));
+ }
+ },
+ sanitizeResources: false,
+ sanitizeOps: false,
+});