shmakk 1.2.4 → 1.2.5

package/src/vibedit/files.js

@@ -0,0 +1,171 @@
+// Source file walking and search/replace edit block application.
+// Ported from vibedit for shmakk integration.
+
+const fs = require('fs');
+const path = require('path');
+
+const SOURCE_EXT = new Set([
+  ".html", ".htm", ".js", ".jsx", ".ts", ".tsx", ".vue", ".svelte", ".astro",
+  ".css", ".scss", ".sass", ".less", ".mjs", ".cjs"
+]);
+const IGNORE_DIRS = new Set([
+  "node_modules", ".git", "dist", "build", ".next", ".nuxt", ".output",
+    ".shmakk", "coverage", ".cache", ".svelte-kit", "out", "vendor"
+]);
+const MAX_FILE_BYTES = 400_000;
+const MAX_SHORTLIST = 5;
+const MAX_TOTAL_CHARS = 16_000;
+
+function walkSources(root) {
+  const out = [];
+  const stack = [root];
+  while (stack.length) {
+    const dir = stack.pop();
+    let entries;
+    try { entries = fs.readdirSync(dir, { withFileTypes: true }); } catch { continue; }
+    for (const e of entries) {
+      if (e.name.startsWith(".") && e.name !== ".env") continue;
+      const full = path.join(dir, e.name);
+      if (e.isDirectory()) {
+        if (!IGNORE_DIRS.has(e.name)) stack.push(full);
+      } else if (SOURCE_EXT.has(path.extname(e.name))) {
+        try { if (fs.statSync(full).size <= MAX_FILE_BYTES) out.push(full); } catch {}
+      }
+    }
+  }
+  return out;
+}
+
+function extractNeedles(changes) {
+  const needles = new Set();
+  for (const ch of changes) {
+    if (ch.kind === "css") {
+      if (ch.selector) needles.add(ch.selector.replace(/^\./, ""));
+      for (const m of (ch.before || "").matchAll(/([\w-]+)\s*:/g)) if (m[1].length >= 4) needles.add(m[1]);
+      continue;
+    }
+    for (const html of [ch.before, ch.after]) {
+      if (!html) continue;
+      const text = html.replace(/<[^>]+>/g, " ").replace(/\s+/g, " ").trim();
+      for (const frag of text.split(/[.!?\n]/)) {
+        const f = frag.trim();
+        if (f.length >= 6 && f.length <= 80) needles.add(f);
+      }
+      for (const m of html.matchAll(/class="([^"]+)"/g)) {
+        for (const cls of m[1].split(/\s+/)) if (cls.length >= 4) needles.add(cls);
+      }
+      for (const m of html.matchAll(/id="([^"]+)"/g)) if (m[1].length >= 3) needles.add(m[1]);
+    }
+    if (ch.selector) {
+      for (const part of ch.selector.split(/[\s>.#:\[\]]+/)) {
+        if (part.length >= 4 && !/^(div|span|nth|of|type)$/.test(part)) needles.add(part);
+      }
+    }
+  }
+  return [...needles].slice(0, 60);
+}
+
+function shortlistFiles(projectDir, changes) {
+  const needles = extractNeedles(changes);
+  if (needles.length === 0) return [];
+  const files = walkSources(projectDir);
+  const scored = [];
+  for (const file of files) {
+    let content;
+    try { content = fs.readFileSync(file, "utf8"); } catch { continue; }
+    let score = 0;
+    const hitLines = new Set();
+    for (const n of needles) {
+      let idx = content.indexOf(n);
+      while (idx !== -1) {
+        score += Math.min(n.length, 30);
+        hitLines.add(content.slice(0, idx).split("\n").length);
+        idx = content.indexOf(n, idx + n.length);
+        if (score > 5000) break;
+      }
+    }
+    if (score > 0) scored.push({ file, score, content, hitLines: [...hitLines] });
+  }
+  scored.sort((a, b) => b.score - a.score);
+  const top = scored.slice(0, MAX_SHORTLIST);
+  let budget = MAX_TOTAL_CHARS;
+  const result = [];
+  for (const s of top) {
+    let snippet = s.content;
+    if (snippet.length > budget) {
+      snippet = windowsAroundLines(s.content, s.hitLines, Math.max(budget, 2000));
+    }
+    snippet = snippet.slice(0, budget);
+    budget -= snippet.length;
+    result.push({ path: path.relative(projectDir, s.file), content: snippet, truncated: snippet.length < s.content.length });
+    if (budget < 1500) break;
+  }
+  return result;
+}
+
+function windowsAroundLines(content, lines, charBudget) {
+  const all = content.split("\n");
+  const keep = new Set();
+  for (const ln of lines) {
+    for (let i = Math.max(0, ln - 16); i < Math.min(all.length, ln + 16); i++) keep.add(i);
+  }
+  const parts = [];
+  let chunk = [];
+  let prev = -2;
+  const sorted = [...keep].sort((a, b) => a - b);
+  for (const i of sorted) {
+    if (i !== prev + 1 && chunk.length) { parts.push(chunk.join("\n")); chunk = []; }
+    chunk.push(all[i]);
+    prev = i;
+  }
+  if (chunk.length) parts.push(chunk.join("\n"));
+  return parts.join("\n...\n").slice(0, charBudget);
+}
+
+const BLOCK_RE = /FILE:\s*(.+?)\s*\n<{5,}\s*SEARCH\s*\n([\s\S]*?)\n={5,}\s*\n([\s\S]*?)\n>{5,}\s*REPLACE/g;
+
+function applyEditBlocks(projectDir, stateDir, modelOutput) {
+  const applied = [];
+  const failed = [];
+  const backupDir = path.join(stateDir, "backups", String(Date.now()));
+  let m;
+  while ((m = BLOCK_RE.exec(modelOutput)) !== null) {
+    const relPath = m[1].trim().replace(/^["'`]|["'`]$/g, "");
+    const search = m[2];
+    const replace = m[3];
+    const full = path.join(projectDir, relPath);
+    if (!full.startsWith(projectDir)) { failed.push(`${relPath} (outside project)`); continue; }
+    let content;
+    try { content = fs.readFileSync(full, "utf8"); } catch { failed.push(`${relPath} (not readable)`); continue; }
+    let next = exactReplace(content, search, replace) ?? fuzzyReplace(content, search, replace);
+    if (next === null) { failed.push(`${relPath} (search text not found)`); continue; }
+    fs.mkdirSync(path.join(backupDir, path.dirname(relPath)), { recursive: true });
+    fs.writeFileSync(path.join(backupDir, relPath), content);
+    fs.writeFileSync(full, next);
+    applied.push(relPath);
+  }
+  return { applied, failed };
+}
+
+function exactReplace(content, search, replace) {
+  const idx = content.indexOf(search);
+  if (idx === -1) return null;
+  return content.slice(0, idx) + replace + content.slice(idx + search.length);
+}
+
+function fuzzyReplace(content, search, replace) {
+  const cLines = content.split("\n");
+  const sLines = search.split("\n").map((l) => l.trim()).filter((l, i, a) => !(l === "" && (i === 0 || i === a.length - 1)));
+  if (sLines.length === 0) return null;
+  outer: for (let i = 0; i <= cLines.length - sLines.length; i++) {
+    for (let j = 0; j < sLines.length; j++) {
+      if (cLines[i + j].trim() !== sLines[j]) continue outer;
+    }
+    const before = cLines.slice(0, i).join("\n");
+    const after = cLines.slice(i + sLines.length).join("\n");
+    return [before, replace, after].filter((s, k) => s !== "" || k === 1).join("\n");
+  }
+  return null;
+}
+
+module.exports = { walkSources, extractNeedles, shortlistFiles, applyEditBlocks };

package/src/vibedit/index.js

@@ -0,0 +1,298 @@
+// vibedit — in-browser overlay chat + recorder, integrated into shmakk.
+// Starts a visible Playwright Chromium browser, injects the overlay into
+// every page load, and runs the control WebSocket server for chat/save/flow.
+//
+// The target can be:
+//   - A URL (http://... or https://...)
+//   - An HTML file (opened directly as file://)
+//   - A package.json or directory containing one (dev server auto-started)
+
+const { chromium } = require('playwright');
+const { spawn } = require('child_process');
+const fs = require('fs');
+const path = require('path');
+const http = require('http');
+const { startControlServer } = require('./control');
+const { ensureVibeditState } = require('./state');
+
+const VIBEDIT_CONTROL_PORT = 0;
+
+// URL pattern matched against dev server stdout lines.
+const DEV_URL_RE = /(https?:\/\/localhost:\d{1,5}|https?:\/\/127\.0\.0\.1:\d{1,5}|https?:\/\/\[::1\]:\d{1,5})/;
+
+// ── resolveTarget ──────────────────────────────────────────────────────────
+
+function resolveTarget(target) {
+  const resolved = path.resolve(target);
+
+  // Already a URL — pass through.
+  if (/^https?:\/\//.test(target)) {
+    return { url: target, proc: null };
+  }
+
+  // The target is a package.json file.
+  if (path.basename(resolved) === 'package.json' && fs.existsSync(resolved)) {
+    return startDevServer(path.dirname(resolved));
+  }
+
+  // The target is an HTML file — open directly as file://.
+  if (/\.html?$/i.test(resolved) && fs.existsSync(resolved) && fs.statSync(resolved).isFile()) {
+    return { url: `file://${resolved}`, proc: null };
+  }
+
+  // The target is a directory — check for package.json first, then index.html.
+  if (fs.existsSync(resolved) && fs.statSync(resolved).isDirectory()) {
+    const pkg = path.join(resolved, 'package.json');
+    if (fs.existsSync(pkg)) return startDevServer(resolved);
+    const idx = path.join(resolved, 'index.html');
+    if (fs.existsSync(idx)) return { url: `file://${idx}`, proc: null };
+    return { url: null, proc: null, error: `no package.json or index.html in ${resolved}` };
+  }
+
+  // The target is some other file — open as file://.
+  if (fs.existsSync(resolved) && fs.statSync(resolved).isFile()) {
+    return { url: `file://${resolved}`, proc: null };
+  }
+
+  // Resolve relative to cwd, same logic.
+  const cwdResolved = path.resolve(process.cwd(), target);
+  if (path.basename(cwdResolved) === 'package.json' && fs.existsSync(cwdResolved)) {
+    return startDevServer(path.dirname(cwdResolved));
+  }
+  if (/\.html?$/i.test(cwdResolved) && fs.existsSync(cwdResolved) && fs.statSync(cwdResolved).isFile()) {
+    return { url: `file://${cwdResolved}`, proc: null };
+  }
+  if (fs.existsSync(cwdResolved) && fs.statSync(cwdResolved).isDirectory()) {
+    const pkg = path.join(cwdResolved, 'package.json');
+    if (fs.existsSync(pkg)) return startDevServer(cwdResolved);
+    const idx = path.join(cwdResolved, 'index.html');
+    if (fs.existsSync(idx)) return { url: `file://${idx}`, proc: null };
+  }
+  if (fs.existsSync(cwdResolved) && fs.statSync(cwdResolved).isFile()) {
+    return { url: `file://${cwdResolved}`, proc: null };
+  }
+
+  // Fallback: assume it's a URL.
+  return { url: target, proc: null };
+}
+
+// ── startDevServer ─────────────────────────────────────────────────────────
+// Reads package.json, picks the dev/start/serve script, spawns it, and
+// watches stdout for the URL the dev server prints.
+
+function detectPackageManager(projectDir) {
+  if (fs.existsSync(path.join(projectDir, 'pnpm-lock.yaml'))) return 'pnpm';
+  if (fs.existsSync(path.join(projectDir, 'bun.lockb')) || fs.existsSync(path.join(projectDir, 'bun.lock'))) return 'bun';
+  if (fs.existsSync(path.join(projectDir, 'yarn.lock'))) return 'yarn';
+  if (fs.existsSync(path.join(projectDir, 'package-lock.json'))) return 'npm';
+  return 'npm';
+}
+
+function pickDevScript(pkg) {
+  const scripts = pkg.scripts || {};
+  if (scripts.dev) return 'dev';
+  if (scripts.start) return 'start';
+  if (scripts.serve) return 'serve';
+  if (scripts.develop) return 'develop';
+  return null;
+}
+
+function startDevServer(projectDir) {
+  let pkg;
+  try {
+    pkg = JSON.parse(fs.readFileSync(path.join(projectDir, 'package.json'), 'utf8'));
+  } catch {
+    return { url: null, proc: null, error: `failed to read ${path.join(projectDir, 'package.json')}` };
+  }
+
+  const scriptName = pickDevScript(pkg);
+  if (!scriptName) {
+    return { url: null, proc: null, error: 'no dev, start, or serve script in package.json' };
+  }
+
+  const pm = detectPackageManager(projectDir);
+  const args = pm === 'npm' || pm === 'yarn' ? ['run', scriptName] : [scriptName];
+  const cmd = pm;
+
+  console.log(`[shmakk vibedit] starting: ${cmd} ${args.join(' ')} (in ${projectDir})`);
+
+  const proc = spawn(cmd, args, {
+    cwd: projectDir,
+    stdio: ['ignore', 'pipe', 'pipe'],
+    shell: true,
+  });
+
+  const urlPromise = new Promise((resolveUrl) => {
+    let found = false;
+
+    function onLine(line) {
+      if (found) return;
+      const m = line.match(DEV_URL_RE);
+      if (m) {
+        found = true;
+        const url = m[1].replace(/\/+$/, '');
+        console.log(`[shmakk vibedit] detected dev server: ${url}`);
+        resolveUrl(url);
+      }
+    }
+
+    let stdoutBuf = '';
+    proc.stdout.on('data', (chunk) => {
+      stdoutBuf += chunk.toString();
+      const lines = stdoutBuf.split('\n');
+      stdoutBuf = lines.pop();
+      for (const ln of lines) onLine(ln);
+    });
+
+    let stderrBuf = '';
+    proc.stderr.on('data', (chunk) => {
+      stderrBuf += chunk.toString();
+      const lines = stderrBuf.split('\n');
+      stderrBuf = lines.pop();
+      for (const ln of lines) onLine(ln);
+    });
+
+    proc.on('close', (code) => {
+      if (!found) resolveUrl(null);
+    });
+
+    proc.on('error', () => {
+      if (!found) resolveUrl(null);
+    });
+  });
+
+  return { urlPromise, proc };
+}
+
+// ── waitReachable ──────────────────────────────────────────────────────────
+
+async function waitReachable(url, timeoutMs) {
+  // file:// URLs don't need reachability checks.
+  if (url.startsWith('file://')) return true;
+
+  return new Promise((resolve) => {
+    const deadline = Date.now() + (timeoutMs || 30000);
+    const tryConnect = () => {
+      if (Date.now() >= deadline) return resolve(false);
+      const req = http.get(url, (res) => { res.resume(); resolve(true); });
+      req.on('error', () => setTimeout(tryConnect, 500));
+      req.setTimeout(2000, () => { req.destroy(); setTimeout(tryConnect, 500); });
+    };
+    tryConnect();
+  });
+}
+
+// ── startVibedit ───────────────────────────────────────────────────────────
+
+// Resolve the built-in extension path. Returns the absolute path if the
+// manifest exists, otherwise null.
+function resolveExtensionPath() {
+  const extPath = path.resolve(__dirname, '..', '..', 'extensions', 'vibedit');
+  if (fs.existsSync(path.join(extPath, 'manifest.json'))) return extPath;
+  return null;
+}
+
+async function startVibedit(opts) {
+  let { projectDir, appUrl, onSpec, useExtension } = opts;
+
+  // Resolve target.
+  const target = resolveTarget(appUrl);
+  let resolvedUrl;
+  let devProc = null;
+
+  if (target.urlPromise) {
+    // Dev server was spawned — wait for the URL with a 60s timeout.
+    console.log('[shmakk vibedit] waiting for dev server URL...');
+    resolvedUrl = await Promise.race([
+      target.urlPromise,
+      new Promise((r) => setTimeout(() => r(null), 60000)),
+    ]);
+    devProc = target.proc;
+    if (!resolvedUrl) {
+      console.error('[shmakk vibedit] dev server did not print a URL within 60s');
+      if (devProc) { try { devProc.kill(); } catch {} }
+      return null;
+    }
+  } else if (target.error) {
+    console.error(`[shmakk vibedit] ${target.error}`);
+    return null;
+  } else {
+    resolvedUrl = target.url;
+  }
+
+  const state = ensureVibeditState(projectDir);
+
+  const port = opts.port ?? VIBEDIT_CONTROL_PORT;
+
+  // Launch visible browser.
+  const browser = await chromium.launch({
+    headless: false,
+    args: ['--disable-blink-features=AutomationControlled'],
+  });
+  const context = await browser.newContext({ viewport: null });
+  const page = await context.newPage();
+
+  console.log(`[shmakk vibedit] app: ${resolvedUrl}`);
+
+  // Start control server (WebSocket + HTTP) with page ref for screenshots.
+  const control = await startControlServer({
+    port,
+    stateDir: state.stateDir,
+    sessionsDir: state.sessionsDir,
+    specsDir: state.specsDir,
+    pendingSpecFile: state.pendingSpecFile,
+    automationsDir: state.automationsDir,
+    pageStateFile: state.pageStateFile,
+    page,
+    projectDir,
+    onSpec,
+  });
+  const controlPort = control.port;
+  console.log(`[shmakk vibedit] control: ws://127.0.0.1:${controlPort}`);
+
+  // Inject overlay on every document load (survives HMR reloads).
+  const overlayJs = fs.readFileSync(path.join(__dirname, 'overlay.js'), 'utf8');
+  const boot = `window.__VIBEDIT__ = { port: ${controlPort} };\n${overlayJs}`;
+  await context.addInitScript({ content: boot });
+
+  // Wait for app to be reachable, then navigate.
+  const reachable = await waitReachable(resolvedUrl, 30000);
+  if (!reachable && !resolvedUrl.startsWith('file://')) {
+    console.warn(`[shmakk vibedit] warning: ${resolvedUrl} is not responding yet, navigating anyway`);
+  }
+
+  let navigated = false;
+  for (let attempt = 1; attempt <= 3 && !navigated; attempt++) {
+    try {
+      await page.goto(resolvedUrl, { waitUntil: 'domcontentloaded', timeout: 20000 });
+      navigated = true;
+    } catch (err) {
+      console.warn(`[shmakk vibedit] navigation attempt ${attempt} failed: ${err.message.split('\n')[0]}`);
+      if (attempt < 3) await new Promise((r) => setTimeout(r, 1500));
+    }
+  }
+  if (!navigated) {
+    console.error(`[shmakk vibedit] could not open ${resolvedUrl}`);
+  }
+
+  let closed = false;
+  const shutdown = async (reason = 'requested') => {
+    if (closed) return;
+    closed = true;
+    console.log(`\n[shmakk vibedit] shutting down (${reason})`);
+    try { await browser.close(); } catch {}
+    control.close();
+    if (devProc) {
+      try { devProc.kill('SIGTERM'); } catch {}
+      // Give it a moment, then force kill.
+      setTimeout(() => { try { devProc.kill('SIGKILL'); } catch {} }, 3000);
+    }
+  };
+
+  page.on('close', () => { shutdown('browser window closed'); });
+  browser.on('disconnected', () => { shutdown('browser disconnected'); });
+
+  return { browser, control, port: controlPort, shutdown };
+}
+
+module.exports = { startVibedit, VIBEDIT_CONTROL_PORT };