haltija 1.2.7 → 1.3.0-beta.1

package/apps/desktop/cdp-network.js

@@ -0,0 +1,379 @@
+/**
+ * CDP Network Monitor — Captures network traffic via Chrome DevTools Protocol.
+ *
+ * Uses Electron's webContents.debugger API to attach to webviews and
+ * capture request/response data. Output is token-optimized for AI agents.
+ *
+ * Usage from main process:
+ *   const { attachNetwork, detachNetwork, getNetworkLog, getNetworkStats, clearNetwork } = require('./cdp-network.js')
+ *   attachNetwork(webContents)       // Start monitoring
+ *   getNetworkLog(webContents.id)    // Get buffered entries
+ */
+
+// Per-webContents state
+const monitors = new Map()
+
+// Default noise patterns — URLs matching these are filtered in standard/minimal presets
+const NOISE_PATTERNS = [
+  /google-analytics\.com/,
+  /googletagmanager\.com/,
+  /facebook\.net\/tr/,
+  /doubleclick\.net/,
+  /hotjar\.com/,
+  /sentry\.io\/api/,
+  /clarity\.ms/,
+  /segment\.io/,
+  /mixpanel\.com/,
+  /amplitude\.com/,
+  /intercom\.io/,
+  /fullstory\.com/,
+  /newrelic\.com/,
+  /datadoghq\.com/,
+]
+
+// Resource types considered "noise" for minimal preset
+const ASSET_TYPES = new Set(['Image', 'Font', 'Stylesheet', 'Media'])
+
+const PRESETS = {
+  errors: { showAssets: false, showNoise: false, errorsOnly: true },
+  minimal: { showAssets: false, showNoise: false, errorsOnly: false },
+  standard: { showAssets: true, showNoise: false, errorsOnly: false },
+  verbose: { showAssets: true, showNoise: true, errorsOnly: false },
+}
+
+/**
+ * Attach CDP Network monitoring to a webContents.
+ * @param {Electron.WebContents} wc
+ * @param {object} opts
+ * @param {string} opts.preset - 'errors' | 'minimal' | 'standard' | 'verbose'
+ * @param {number} opts.maxBuffer - Max entries to keep (default 200)
+ * @param {string[]} opts.includePatterns - URL patterns to include (overrides noise filter)
+ * @param {string[]} opts.excludePatterns - Additional URL patterns to exclude
+ */
+function attachNetwork(wc, opts = {}) {
+  const wcId = wc.id
+  if (monitors.has(wcId)) {
+    // Already attached — update options
+    const mon = monitors.get(wcId)
+    mon.preset = opts.preset || mon.preset
+    mon.maxBuffer = opts.maxBuffer || mon.maxBuffer
+    return { success: true, alreadyAttached: true }
+  }
+
+  const monitor = {
+    wc,
+    preset: opts.preset || 'standard',
+    maxBuffer: opts.maxBuffer || 200,
+    includePatterns: (opts.includePatterns || []).map(p => new RegExp(p)),
+    excludePatterns: (opts.excludePatterns || []).map(p => new RegExp(p)),
+    entries: [],          // circular buffer of NetworkEntry
+    pending: new Map(),   // requestId → partial entry (waiting for response)
+    attached: false,
+  }
+
+  try {
+    wc.debugger.attach('1.3')
+    monitor.attached = true
+  } catch (err) {
+    // Debugger may already be attached by DevTools
+    if (err.message?.includes('Already attached')) {
+      monitor.attached = true
+    } else {
+      return { success: false, error: `CDP attach failed: ${err.message}` }
+    }
+  }
+
+  // Enable Network domain
+  wc.debugger.sendCommand('Network.enable', {}).catch(err => {
+    console.error(`[CDP Network] Network.enable failed for wc ${wcId}:`, err.message)
+  })
+
+  // Listen for CDP events
+  const handler = (event, method, params) => {
+    handleCdpEvent(monitor, method, params)
+  }
+  wc.debugger.on('message', handler)
+  monitor._handler = handler
+
+  // Clean up when webContents is destroyed
+  const destroyHandler = () => {
+    detachNetwork(wc)
+  }
+  wc.once('destroyed', destroyHandler)
+  monitor._destroyHandler = destroyHandler
+
+  monitors.set(wcId, monitor)
+  return { success: true }
+}
+
+/**
+ * Detach CDP Network monitoring from a webContents.
+ */
+function detachNetwork(wc) {
+  const wcId = wc.id
+  const monitor = monitors.get(wcId)
+  if (!monitor) return
+
+  try {
+    if (monitor._handler) {
+      wc.debugger.removeListener('message', monitor._handler)
+    }
+    if (monitor.attached) {
+      wc.debugger.sendCommand('Network.disable', {}).catch(() => {})
+      wc.debugger.detach()
+    }
+  } catch {
+    // Already detached or destroyed
+  }
+
+  monitors.delete(wcId)
+}
+
+/**
+ * Get buffered network entries for a webContents, filtered by preset.
+ * @param {number} wcId - webContents.id
+ * @param {object} opts
+ * @param {string} opts.preset - Override the monitor's preset
+ * @param {number} opts.since - Only entries after this timestamp
+ * @param {number} opts.limit - Max entries to return
+ * @returns {{ entries: NetworkEntry[], summary: string }}
+ */
+function getNetworkLog(wcId, opts = {}) {
+  const monitor = monitors.get(wcId)
+  if (!monitor) return { entries: [], summary: 'not watching' }
+
+  const preset = PRESETS[opts.preset || monitor.preset] || PRESETS.standard
+  const since = opts.since || 0
+  const limit = opts.limit || 100
+
+  let filtered = monitor.entries.filter(e => e.ts >= since)
+
+  // Apply preset filtering
+  if (preset.errorsOnly) {
+    filtered = filtered.filter(e => e.s >= 400 || e.s === -1 || e.err)
+  }
+  if (!preset.showAssets) {
+    filtered = filtered.filter(e => !ASSET_TYPES.has(e.type))
+  }
+  if (!preset.showNoise) {
+    filtered = filtered.filter(e => !isNoise(e.url, monitor))
+  }
+
+  // Apply custom include/exclude
+  if (monitor.includePatterns.length > 0) {
+    // Include patterns override noise filter
+    filtered = monitor.entries.filter(e =>
+      e.ts >= since && monitor.includePatterns.some(p => p.test(e.url))
+    )
+  }
+  if (monitor.excludePatterns.length > 0) {
+    filtered = filtered.filter(e => !monitor.excludePatterns.some(p => p.test(e.url)))
+  }
+
+  // Most recent first, limited
+  filtered = filtered.slice(-limit)
+
+  const summary = buildSummary(monitor.entries.filter(e => e.ts >= since))
+
+  return { entries: filtered, summary }
+}
+
+/**
+ * Get summary statistics.
+ */
+function getNetworkStats(wcId) {
+  const monitor = monitors.get(wcId)
+  if (!monitor) return { watching: false }
+
+  const entries = monitor.entries
+  const total = entries.length
+  const failed = entries.filter(e => e.s >= 400 || e.s === -1 || e.err).length
+  const pending = monitor.pending.size
+  const totalBytes = entries.reduce((sum, e) => sum + (e.bytes || 0), 0)
+  const avgTime = total > 0 ? Math.round(entries.reduce((sum, e) => sum + (e.t || 0), 0) / total) : 0
+
+  return {
+    watching: true,
+    preset: monitor.preset,
+    total,
+    failed,
+    pending,
+    totalBytes,
+    avgTime,
+    summary: buildSummary(entries),
+  }
+}
+
+/**
+ * Clear the network buffer.
+ */
+function clearNetwork(wcId) {
+  const monitor = monitors.get(wcId)
+  if (!monitor) return
+  monitor.entries = []
+  monitor.pending.clear()
+}
+
+/**
+ * Check if a webContents is being monitored.
+ */
+function isMonitoring(wcId) {
+  return monitors.has(wcId)
+}
+
+// ============================================
+// Internal: CDP event handling
+// ============================================
+
+function handleCdpEvent(monitor, method, params) {
+  switch (method) {
+    case 'Network.requestWillBeSent':
+      handleRequestStart(monitor, params)
+      break
+    case 'Network.responseReceived':
+      handleResponse(monitor, params)
+      break
+    case 'Network.loadingFinished':
+      handleLoadingFinished(monitor, params)
+      break
+    case 'Network.loadingFailed':
+      handleLoadingFailed(monitor, params)
+      break
+  }
+}
+
+function handleRequestStart(monitor, params) {
+  const { requestId, request, redirectResponse, type, timestamp } = params
+
+  // If this is a redirect, update the existing entry
+  if (redirectResponse && monitor.pending.has(requestId)) {
+    const existing = monitor.pending.get(requestId)
+    existing.redirects = (existing.redirects || 0) + 1
+    existing.url = trimUrl(request.url)
+    existing.m = request.method
+    return
+  }
+
+  const entry = {
+    id: requestId.slice(0, 8),
+    m: request.method,
+    url: trimUrl(request.url),
+    fullUrl: request.url,
+    s: 0,         // pending
+    t: 0,
+    sz: '',
+    bytes: 0,
+    type: type || 'Other',
+    ts: Math.round(timestamp * 1000),
+    _startTime: timestamp,
+  }
+
+  monitor.pending.set(requestId, entry)
+}
+
+function handleResponse(monitor, params) {
+  const { requestId, response } = params
+  const entry = monitor.pending.get(requestId)
+  if (!entry) return
+
+  entry.s = response.status
+  entry.mimeType = response.mimeType
+
+  // Detect CORS errors
+  if (response.status === 0 && response.headers?.['access-control-allow-origin'] === undefined) {
+    entry.cors = true
+    entry.err = 'CORS'
+  }
+}
+
+function handleLoadingFinished(monitor, params) {
+  const { requestId, encodedDataLength, timestamp } = params
+  const entry = monitor.pending.get(requestId)
+  if (!entry) return
+
+  entry.bytes = encodedDataLength || 0
+  entry.sz = humanSize(entry.bytes)
+  entry.t = Math.round((timestamp - entry._startTime) * 1000)
+  delete entry._startTime
+  delete entry.fullUrl
+
+  finishEntry(monitor, requestId, entry)
+}
+
+function handleLoadingFailed(monitor, params) {
+  const { requestId, errorText, canceled, timestamp } = params
+  const entry = monitor.pending.get(requestId)
+  if (!entry) return
+
+  entry.s = -1
+  entry.err = canceled ? 'canceled' : (errorText || 'failed')
+  entry.t = Math.round((timestamp - entry._startTime) * 1000)
+  delete entry._startTime
+  delete entry.fullUrl
+
+  finishEntry(monitor, requestId, entry)
+}
+
+function finishEntry(monitor, requestId, entry) {
+  monitor.pending.delete(requestId)
+  monitor.entries.push(entry)
+
+  // Trim buffer
+  while (monitor.entries.length > monitor.maxBuffer) {
+    monitor.entries.shift()
+  }
+}
+
+// ============================================
+// Internal: formatting helpers
+// ============================================
+
+function trimUrl(url) {
+  try {
+    const u = new URL(url)
+    let path = u.pathname
+    // Collapse long paths
+    if (path.length > 60) {
+      const parts = path.split('/')
+      if (parts.length > 4) {
+        path = '/' + parts[1] + '/.../' + parts[parts.length - 1]
+      }
+    }
+    // Trim query
+    let query = u.search
+    if (query.length > 30) {
+      query = query.slice(0, 27) + '...'
+    }
+    // Omit localhost origin
+    const origin = (u.hostname === 'localhost' || u.hostname === '127.0.0.1')
+      ? '' : u.host
+    return (origin ? origin : '') + path + query
+  } catch {
+    return url.length > 80 ? url.slice(0, 77) + '...' : url
+  }
+}
+
+function humanSize(bytes) {
+  if (bytes === 0) return '0B'
+  if (bytes < 1024) return bytes + 'B'
+  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1).replace(/\.0$/, '') + 'K'
+  return (bytes / (1024 * 1024)).toFixed(1).replace(/\.0$/, '') + 'M'
+}
+
+function isNoise(url, monitor) {
+  return NOISE_PATTERNS.some(p => p.test(url))
+}
+
+function buildSummary(entries) {
+  const total = entries.length
+  const failed = entries.filter(e => e.s >= 400 || e.s === -1 || e.err).length
+  const totalBytes = entries.reduce((sum, e) => sum + (e.bytes || 0), 0)
+  const avgTime = total > 0 ? Math.round(entries.reduce((sum, e) => sum + (e.t || 0), 0) / total) : 0
+  const parts = [`${total} req`]
+  if (failed > 0) parts.push(`${failed} failed`)
+  parts.push(`${avgTime}ms avg`)
+  parts.push(humanSize(totalBytes))
+  return parts.join(', ')
+}
+
+module.exports = { attachNetwork, detachNetwork, getNetworkLog, getNetworkStats, clearNetwork, isMonitoring, humanSize }

package/apps/desktop/main.js

@@ -23,6 +23,7 @@ const fs = require('fs')
 const os = require('os')
 const { spawn } = require('child_process')
 const http = require('http')
+const { attachNetwork, detachNetwork, getNetworkLog, getNetworkStats, clearNetwork, isMonitoring } = require('./cdp-network.js')
 
 // Suppress EIO errors when stdout/stderr pipes break during shutdown
 process.stdout.on('error', () => {})
@@ -700,6 +701,19 @@ function setupWebContentsInjection(wc) {
   })
 }
 
+/**
+ * Find the webview webContents for a given IPC sender.
+ * If sender IS a webview, return it directly.
+ * If sender is the renderer (main window), return null (caller should use explicit wcId).
+ */
+function findWebContentsForSender(sender) {
+  if (!sender) return null
+  // webview-preload.js IPC: sender is the webview itself
+  if (sender.getType() === 'webview') return sender
+  // renderer preload.js IPC: sender is the main window, not useful for targeting a specific webview
+  return null
+}
+
 async function injectWidget(webContents) {
   const url = webContents.getURL()
   console.log('[Haltija Desktop] Injecting widget into:', url)
@@ -881,12 +895,13 @@ function setupScreenCapture() {
 
   // Navigate URL with smart fallback (called from widget in webview)
   // Routes through renderer's navigate() which has https->http fallback
+  // Passes the sender's webContentsId so the renderer navigates the correct tab
   ipcMain.handle('navigate-url', async (event, url) => {
     if (!mainWindow) return { success: false, error: 'No window' }
 
     try {
-      // Send to renderer which has the smart navigate function
-      mainWindow.webContents.send('navigate-url', { url })
+      const senderWcId = event.sender.id
+      mainWindow.webContents.send('navigate-url', { url, webContentsId: senderWcId })
       return { success: true }
     } catch (err) {
       return { success: false, error: err.message }
@@ -913,6 +928,48 @@ function setupScreenCapture() {
     return true
   })
 
+  // CDP Network monitoring — manages per-webContents debugger sessions
+  // Accepts explicit wcId for renderer-routed calls, falls back to sender for direct webview calls
+  const resolveNetworkWc = (event, wcId) => {
+    if (wcId) {
+      const { webContents: wcModule } = require('electron')
+      return wcModule.fromId(wcId)
+    }
+    return findWebContentsForSender(event.sender)
+  }
+
+  ipcMain.handle('network-watch', async (event, opts = {}) => {
+    const wc = resolveNetworkWc(event, opts.wcId)
+    if (!wc) return { success: false, error: 'No webview found' }
+    return attachNetwork(wc, opts)
+  })
+
+  ipcMain.handle('network-unwatch', async (event, wcId) => {
+    const wc = resolveNetworkWc(event, wcId)
+    if (!wc) return { success: false, error: 'No webview found' }
+    detachNetwork(wc)
+    return { success: true }
+  })
+
+  ipcMain.handle('network-log', async (event, opts = {}) => {
+    const wc = resolveNetworkWc(event, opts.wcId)
+    if (!wc) return { entries: [], summary: 'no webview' }
+    return getNetworkLog(wc.id, opts)
+  })
+
+  ipcMain.handle('network-stats', async (event, wcId) => {
+    const wc = resolveNetworkWc(event, wcId)
+    if (!wc) return { watching: false }
+    return getNetworkStats(wc.id)
+  })
+
+  ipcMain.handle('network-clear', async (event, wcId) => {
+    const wc = resolveNetworkWc(event, wcId)
+    if (!wc) return { success: false }
+    clearNetwork(wc.id)
+    return { success: true }
+  })
+
   // Video capture — forwarded to renderer where MediaRecorder runs
   // Widget (webview) → main → renderer → main → widget
   // Main also provides media source ID from webContents (not available on webview DOM element)

package/apps/desktop/package.json

@@ -1,6 +1,6 @@
 {
   "name": "haltija-desktop",
-  "version": "1.2.7",
+  "version": "1.3.0-beta.1",
   "description": "Haltija Desktop - God Mode Browser for AI Agents",
   "homepage": "https://github.com/tonioloewald/haltija",
   "author": {

package/apps/desktop/renderer/agent-status.js

@@ -52,7 +52,9 @@ function handleAgentStatusMessage(msg) {
       break
     case 'shell-renamed':
       if (connectedShells.has(msg.shellId)) {
-        connectedShells.get(msg.shellId).name = msg.name
+        const info = connectedShells.get(msg.shellId)
+        info.name = msg.name
+        info.isAgent = msg.name?.includes('agent')
         updateAgentSelector()
       }
       break
@@ -186,6 +188,12 @@ function updateAgentSelector() {
   const agents = Array.from(connectedShells.entries())
     .filter(([_, info]) => info.isAgent)
 
+  // Hide the selector unless there are multiple agents to choose between
+  const selectorEl = el.agentSelect?.parentElement
+  if (selectorEl) {
+    selectorEl.style.display = agents.length > 1 ? '' : 'none'
+  }
+
   if (agents.length === 0) {
     el.agentSelect.innerHTML = '<option value="">No agents</option>'
   } else {
@@ -196,6 +204,10 @@ function updateAgentSelector() {
 }
 
 export async function initAgentStatusBar() {
+  // Hide agent selector by default (only shown when multiple agents connected)
+  const selectorEl = el.agentSelect?.parentElement
+  if (selectorEl) selectorEl.style.display = 'none'
+
   try {
     const response = await fetch(`${getServerUrl()}/terminal/status`)
     if (response.ok) {
@@ -206,5 +218,17 @@ export async function initAgentStatusBar() {
     console.log('[Agent Status] Could not fetch initial status:', err.message)
   }
 
+  // Seed agent list from existing sessions (may have connected before this WS)
+  try {
+    const res = await fetch(`${getServerUrl()}/terminal/agents`)
+    if (res.ok) {
+      const data = await res.json()
+      for (const agent of data.agents || []) {
+        connectedShells.set(agent.id, { name: agent.name, isAgent: true })
+      }
+      updateAgentSelector()
+    }
+  } catch {}
+
   connectAgentStatusWs()
 }

package/apps/desktop/renderer/tabs.js

@@ -258,6 +258,14 @@ export function navigate(url, tabId = activeTabId) {
   const tab = tabs.find((t) => t.id === tabId)
   if (!tab) return
 
+  // Never navigate terminal/agent iframes — they aren't browser tabs
+  if (tab.isTerminal) {
+    console.warn('[Haltija] Refusing to navigate terminal tab, finding content tab instead')
+    const contentTab = tabs.find(t => !t.isTerminal)
+    if (contentTab) return navigate(url, contentTab.id)
+    return
+  }
+
   let addedHttps = false
 
   if (url && !url.match(/^(https?|blob|data|file|about|javascript):\/?\/?/i)) {

package/apps/desktop/renderer.js

@@ -202,8 +202,24 @@ if (window.haltija) {
   })
 
   window.haltija.onNavigateUrl?.((data) => {
-    console.log('[Haltija Desktop] Navigate request from widget:', data.url)
-    navigate(data.url)
+    console.log('[Haltija Desktop] Navigate request from widget:', data.url, 'wcId:', data.webContentsId)
+    // Find the tab that owns the webview that sent the navigate request
+    // so we navigate the correct tab, not the active (possibly terminal) tab
+    let targetTabId = undefined
+    if (data.webContentsId) {
+      const match = tabs.find(t => {
+        try {
+          return t.webview?.getWebContentsId && t.webview.getWebContentsId() === data.webContentsId
+        } catch { return false }
+      })
+      if (match) targetTabId = match.id
+    }
+    // Fallback: navigate the first non-terminal tab (never navigate a terminal/agent iframe)
+    if (!targetTabId) {
+      const contentTab = tabs.find(t => !t.isTerminal)
+      if (contentTab) targetTabId = contentTab.id
+    }
+    navigate(data.url, targetTabId)
   })
 }
 

package/apps/desktop/resources/component.js

@@ -46,7 +46,7 @@
   });
 
   // src/version.ts
-  var VERSION = "1.2.7";
+  var VERSION = "1.3.0-beta.1";
 
   // src/text-selector.ts
   var TEXT_PSEUDO_RE = /:(?:text-is|has-text|text)\(/;
@@ -5164,6 +5164,9 @@ ${elementSummary}${moreText}`;
         case "video":
           this.handleVideoMessage(msg2);
           break;
+        case "network":
+          this.handleNetworkMessage(msg2);
+          break;
       }
       this.render();
     }
@@ -5232,6 +5235,64 @@ ${elementSummary}${moreText}`;
         this.respond(msg2.id, false, undefined, `Unknown video action: ${action2}`);
       }
     }
+    handleNetworkMessage(msg2) {
+      const { action: action2, payload: payload2 } = msg2;
+      const haltija = window.haltija;
+      const notAvailable = "Network monitoring requires the Haltija Desktop app (CDP access)";
+      if (action2 === "watch") {
+        if (!haltija?.networkWatch) {
+          this.respond(msg2.id, false, undefined, notAvailable);
+          return;
+        }
+        haltija.networkWatch(payload2 || {}).then((result2) => {
+          this.respond(msg2.id, result2.success !== false, result2);
+        }).catch((err) => {
+          this.respond(msg2.id, false, undefined, err.message);
+        });
+      } else if (action2 === "unwatch") {
+        if (!haltija?.networkUnwatch) {
+          this.respond(msg2.id, false, undefined, notAvailable);
+          return;
+        }
+        haltija.networkUnwatch().then((result2) => {
+          this.respond(msg2.id, true, result2);
+        }).catch((err) => {
+          this.respond(msg2.id, false, undefined, err.message);
+        });
+      } else if (action2 === "get") {
+        if (!haltija?.networkLog) {
+          this.respond(msg2.id, false, undefined, notAvailable);
+          return;
+        }
+        haltija.networkLog(payload2 || {}).then((result2) => {
+          this.respond(msg2.id, true, result2);
+        }).catch((err) => {
+          this.respond(msg2.id, false, undefined, err.message);
+        });
+      } else if (action2 === "stats") {
+        if (!haltija?.networkStats) {
+          this.respond(msg2.id, false, undefined, notAvailable);
+          return;
+        }
+        haltija.networkStats().then((result2) => {
+          this.respond(msg2.id, true, result2);
+        }).catch((err) => {
+          this.respond(msg2.id, false, undefined, err.message);
+        });
+      } else if (action2 === "clear") {
+        if (!haltija?.networkClear) {
+          this.respond(msg2.id, false, undefined, notAvailable);
+          return;
+        }
+        haltija.networkClear().then((result2) => {
+          this.respond(msg2.id, true, result2);
+        }).catch((err) => {
+          this.respond(msg2.id, false, undefined, err.message);
+        });
+      } else {
+        this.respond(msg2.id, false, undefined, `Unknown network action: ${action2}`);
+      }
+    }
     handleSemanticMessage(msg2) {
       const { action: action2, payload: payload2 } = msg2;
       if (action2 === "start" || action2 === "watch") {