demobites 1.21.1 → 1.23.0

package/launcher/index.mjs

@@ -36,7 +36,8 @@ const warn = (m) => console.log(`  ! ${m}`);
 
 // The skill's home and the project's key. The key lives in <cwd>/.recorder/config.json
 // (login.mjs writes it there), so everything here is per-project.
-const skillsDir = path.join(os.homedir(), ".claude", "skills");
+// A test home (DEMOBITE_HOME) keeps its own skill copy too: two recorders on one Mac must never refresh each other's camera.
+const skillsDir = process.env.DEMOBITE_HOME ? path.join(process.env.DEMOBITE_HOME, "skills") : path.join(os.homedir(), ".claude", "skills");
 const dest = path.join(skillsDir, "agentic-recorder");
 const readCfg = () => {
   try { return JSON.parse(fs.readFileSync(path.join(process.cwd(), ".recorder", "config.json"), "utf8")); }
@@ -121,6 +122,41 @@ const removeService = () => {
   else if (process.platform === "linux") spawnSync("systemctl", ["--user", "disable", "--now", SERVICE_UNIT], { stdio: "ignore" });
   else spawnSync("reg", ["delete", "HKCU\\Software\\Microsoft\\Windows\\CurrentVersion\\Run", "/v", RUN_NAME, "/f"], { stdio: "ignore" });
 };
+// ── demobite repo <site> [--forget] (1.22.0, founder 2026-10-16) ──────────────────────────────
+// Run in the folder where the app's repository is: that folder becomes the code of that SITE on this
+// machine. The planner reads from it when a demo records there (up to 10 files a take, each logged).
+// The binding lives with the machine (~/.demobite/home/.recorder/repos.json, or the Terminal listener's
+// own .recorder), and the app shows it on the bar as the Code mark.
+const SLD = new Set(["co", "com", "net", "org", "gov", "edu", "ac"]);
+const siteOf = (hostname) => { const h = String(hostname).toLowerCase().replace(/:\d+$/, ""); if (/^[\d.]+$/.test(h) || h === "localhost" || !h.includes(".")) return h; const l = h.split("."); return l.length >= 3 && SLD.has(l[l.length - 2]) && l[l.length - 1].length === 2 ? l.slice(-3).join(".") : l.slice(-2).join("."); };
+const reposFile = (cwd) => path.join(cwd, ".recorder", "repos.json");
+if (arg === "repo") {
+  const raw = process.argv.slice(3).find((a) => !a.startsWith("--")) || "";
+  const forget = process.argv.includes("--forget");
+  let site = "";
+  try { site = siteOf(new URL(/^https?:\/\//i.test(raw) ? raw : `https://${raw}`).hostname); } catch { /* below */ }
+  if (!site) { console.error("  Usage: demobite repo <site> [--forget]   (run it in the folder where the app's repository is)\n  e.g.   demobite repo app.acme.com"); process.exit(2); }
+  const lock = readJson(LOCK);
+  const home = lock?.cwd && fs.existsSync(path.join(lock.cwd, ".recorder")) ? lock.cwd : SERVICE_CWD;
+  const file = reposFile(home);
+  const repos = readJson(file) ?? {};
+  if (forget) {
+    if (!repos[site]) { console.log(`  Nothing bound to ${site} on this machine.`); process.exit(0); }
+    delete repos[site]; writeJson(file, repos);
+    console.log(`  ○ ${site} no longer has code on this machine. The planner works from the live app there.`);
+    process.exit(0);
+  }
+  const folder = process.cwd();
+  if (spawnSync("git", ["rev-parse", "--is-inside-work-tree"], { encoding: "utf8", cwd: folder }).status !== 0) { console.error(`  This folder is not a git repository: ${folder}\n  Open a Terminal in the folder where the app's repository is, then run it again.`); process.exit(1); }
+  const top = spawnSync("git", ["rev-parse", "--show-toplevel"], { encoding: "utf8", cwd: folder }).stdout.trim() || folder;
+  const remote = spawnSync("git", ["config", "--get", "remote.origin.url"], { encoding: "utf8", cwd: top }).stdout.trim();
+  const m = remote.match(/[:/]([^/:]+\/[^/]+?)(?:\.git)?$/);
+  const repo = m ? m[1] : path.basename(top);
+  repos[site] = { folder: top, repo, at: new Date().toISOString() };
+  writeJson(file, repos);
+  console.log(`  ✓ The code of ${site} on this machine: ${top.replace(os.homedir(), "~")} (${repo}).\n    The planner reads it when a demo records there: up to 10 files a take, each one listed in the take.\n    Lines it needs pass through DemoBites to the model and are not stored. Undo: demobite repo ${site} --forget`);
+  process.exit(0);
+}
 if (arg === "off") {
   removeService();
   const pid = killListener();
@@ -476,8 +512,11 @@ if (arg === "listen") {
   const readiness = () => {
     let signins = [];
     try { signins = Object.keys(JSON.parse(fs.readFileSync(path.join(process.cwd(), ".recorder", "signins.json"), "utf8")).origins || {}); } catch { /* none */ }
-    return { ...agentInfo, chrome: haveChrome, recorder: pkg.version, signins, cwd: process.cwd(), platform: process.platform, repo };
+    const repos = Object.entries(readJson(reposFile(process.cwd())) ?? {}).filter(([, v]) => v && typeof v.folder === "string" && fs.existsSync(v.folder)).map(([site, v]) => ({ site, folder: v.folder, repo: v.repo ?? null }));
+    return { ...agentInfo, chrome: haveChrome, recorder: pkg.version, signins, cwd: process.cwd(), platform: process.platform, repo, repos };
   };
+  // The code bound to a job's site (1.22.0): the planner reads there.
+  const codeFor = (url) => { try { const site = siteOf(new URL(url).hostname); const b = (readJson(reposFile(process.cwd())) ?? {})[site]; return b && fs.existsSync(b.folder) ? { site, ...b } : null; } catch { return null; } };
   const api = async (body) => {
     try {
       const res = await fetch(`${base}/api/recorder/listen`, { method: "PUT", headers: { "Content-Type": "application/json", Authorization: `Bearer ${cfg.api_key}` }, body: JSON.stringify(body) });
@@ -649,7 +688,9 @@ if (arg === "listen") {
       fs.writeFileSync(path.join(takeDir, "job.json"), JSON.stringify({ id: job.id, brief: job.brief, url: job.url ?? null, model, review_storyboard: job.review_storyboard !== false, ...(job.retake_of ? { retake_of: job.retake_of, retake_note: job.retake_note ?? null, storyboard: job.storyboard ?? null } : {}) }, null, 2) + "\n");
       // Spawned async (1.14.1): a spawnSync here blocked the event loop, so the 5 s heartbeat never fired
       // during a take and the rail called the machine offline mid-recording (founder 2026-10-15 17:39).
-      const child = (await import("node:child_process")).spawn(process.execPath, [path.join(dest, "scripts", "plan.mjs"), takeDir], { cwd: process.cwd(), stdio: "inherit", env: { ...process.env, RECORDER_JOB: job.id, RECORDER_BASE: base, RECORDER_LISTEN: "1" }, detached: process.platform !== "win32" });
+      const bound = job.url ? codeFor(job.url) : null;
+      if (bound) console.log(`  Code: ${bound.repo ?? bound.site} (${bound.folder.replace(os.homedir(), "~")})`);
+      const child = (await import("node:child_process")).spawn(process.execPath, [path.join(dest, "scripts", "plan.mjs"), takeDir], { cwd: process.cwd(), stdio: "inherit", env: { ...process.env, RECORDER_JOB: job.id, RECORDER_BASE: base, RECORDER_LISTEN: "1", ...(bound ? { DEMOBITES_CODE_DIR: bound.folder } : {}) }, detached: process.platform !== "win32" });
       track(child);
       const code = await new Promise((resolve) => child.on("close", resolve));
       const st = await api({ action: "poll", job_id: job.id });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "demobites",
-  "version": "1.21.1",
+  "version": "1.23.0",
   "description": "The DemoBites agentic recorder — you prompt, it films a real browser, and DemoBites turns the take into an editable demo bite.",
   "bin": {
     "demobites": "launcher/index.mjs"

package/scripts/record.mjs

@@ -367,6 +367,33 @@ const pushMouse = (type, x, y, button = null, extra = null) => {
 // has nothing to sit on between moves.
 const sampler = setInterval(() => pushMouse("move", cx, cy), CURSOR_SAMPLE_MS);
 
+// THE LIVE FRAME (founder 2026-10-16, "a thumbnail of what we're recording"): a small still of what the
+// camera sees, posted at every step and every few seconds, so the Recordings row in the app shows the
+// take as it happens. Never on the take's path: a frame that fails is dropped, never waited on. One CDP
+// capture at ~480 px wide, JPEG, well under 40 KB; the server keeps only the latest and drops it when
+// the take ends.
+const FRAME_EVERY_MS = 5000;
+let frameCdp = null;
+let framing = false;
+let frameStep = { n: 0, N: 0 };
+let frameWarned = false;
+const postFrame = async () => {
+  if (framing || !frameStep.N) return;
+  framing = true;
+  // A capture can stall while the page navigates (the first take of 2026-10-16 posted nothing: one hung
+  // capture held the flag for the whole take). Four seconds, then the frame is dropped and the next one tries.
+  const within = (p, ms) => Promise.race([p, new Promise((_, rej) => setTimeout(() => rej(new Error(`timeout ${ms} ms`)), ms))]);
+  try {
+    frameCdp ??= await within(ctx.newCDPSession(page), 4000);
+    const scale = Math.min(1, 480 / VIEW.width);
+    const { data } = await within(frameCdp.send("Page.captureScreenshot", { format: "jpeg", quality: 55, clip: { x: 0, y: 0, width: VIEW.width, height: VIEW.height, scale } }), 4000);
+    await within(postEvent("frame", { ...frameStep, jpeg: data }), 8000);
+  } catch (e) {
+    if (!frameWarned) { frameWarned = true; console.error(`frame: dropped (${String(e?.message ?? e).split("\n")[0]})`); }
+  } finally { framing = false; }
+};
+const framer = setInterval(() => void postFrame(), FRAME_EVERY_MS);
+
 /** Ask the element what cursor it shows. Takes the locator visibleBox already
  *  resolved — re-scanning cost ~1s of dead video per step, which inflated a
  *  29s take to 36s purely from instrumentation. Playwright locators pierce
@@ -779,7 +806,7 @@ try {
     process.stdout.write(`step ${rec.n} ${step.action} ${step.label ?? ""}\n`);
     // The customer's line (founder 2026-10-14): one bar, step n of N. The
     // agent relays this, never the step/action lines above.
-    { const N = STORYBOARD.steps.length, filled = Math.round((rec.n / N) * 20); process.stdout.write(`Filming  ${"█".repeat(filled)}${"░".repeat(20 - filled)}  step ${rec.n} of ${N}\n`); void postEvent("filming", { n: rec.n, N }); }
+    { const N = STORYBOARD.steps.length, filled = Math.round((rec.n / N) * 20); process.stdout.write(`Filming  ${"█".repeat(filled)}${"░".repeat(20 - filled)}  step ${rec.n} of ${N}\n`); void postEvent("filming", { n: rec.n, N }); frameStep = { n: rec.n, N }; void postFrame(); }
     if (step.action === "goto") {
       const navIssuedAt = t();
       // domcontentloaded, not load: a heavy site behind a proxy (the cloud
@@ -1210,6 +1237,7 @@ try {
 }
 
 clearInterval(sampler);
+clearInterval(framer);
 manifest.duration = t();
 void postEvent("finishing", { text: "Camera off. Saving the take…" });
 const video = page.video();

package/skill/scripts/plan.mjs

@@ -60,12 +60,15 @@ say("Reading the workspace rules…");
 run("rules.mjs", [dir]);
 const rules = (() => { try { return JSON.parse(fs.readFileSync(path.resolve(".recorder", "rules.json"), "utf8")); } catch { return { version: 0, lines: [] }; } })();
 
-const codeOn = !process.env.DEMOBITES_NO_CODE && spawnSync("git", ["rev-parse", "--is-inside-work-tree"], { encoding: "utf8" }).status === 0;
+// THE CODE FOLDER (1.22.0, founder 2026-10-16): the folder bound to this site with `demobite repo <site>`
+// (the listener passes it as DEMOBITES_CODE_DIR), else the folder the listener runs in.
+const CODE_DIR = process.env.DEMOBITES_CODE_DIR ? path.resolve(process.env.DEMOBITES_CODE_DIR) : process.cwd();
+const codeOn = !process.env.DEMOBITES_NO_CODE && spawnSync("git", ["rev-parse", "--is-inside-work-tree"], { encoding: "utf8", cwd: CODE_DIR }).status === 0;
 const SECRET_RE = /(^|\/)(\.env(\..*)?|.*\.(pem|key|p12|pfx|crt)|.*secret.*|.*credential.*|\.recorder\/.*|node_modules\/.*|\.git\/.*|.*\.lock|package-lock\.json|yarn\.lock|pnpm-lock\.yaml)$/i;
 const UI_RE = /(^|\/)(app|pages|routes|src|components|views|screens|navigation|nav|layouts?|lib\/(nav|routes|menu))(\/|$)|(^|\/)(route|router|routes|nav|navigation|sidebar|menu|layout|page)\.[jt]sx?$|\/page\.[jt]sx?$|\/layout\.[jt]sx?$|\/route\.[jt]s$/i;
 const listFiles = () => {
   if (!codeOn) return "(no repository here, or code sharing is off)";
-  const r = spawnSync("git", ["ls-files"], { encoding: "utf8", maxBuffer: 32 * 1024 * 1024 });
+  const r = spawnSync("git", ["ls-files"], { encoding: "utf8", maxBuffer: 32 * 1024 * 1024, cwd: CODE_DIR });
   if (r.status !== 0) return "(no repository here)";
   const all = r.stdout.split("\n").filter(Boolean).filter((f) => !SECRET_RE.test(f) && /\.(tsx?|jsx?|vue|svelte|html|mdx?)$/i.test(f));
   const ui = all.filter((f) => UI_RE.test(f));
@@ -77,9 +80,9 @@ const shared = [];
 const readFile = (rel) => {
   if (!codeOn) return "Code sharing is off on this machine.";
   if (typeof rel !== "string" || !rel.trim()) return "path required";
-  const abs = path.resolve(process.cwd(), rel);
-  if (!abs.startsWith(process.cwd() + path.sep)) return "Outside the project.";
-  const r = path.relative(process.cwd(), abs);
+  const abs = path.resolve(CODE_DIR, rel);
+  if (!abs.startsWith(CODE_DIR + path.sep)) return "Outside the project.";
+  const r = path.relative(CODE_DIR, abs);
   if (SECRET_RE.test(r)) return "Not that file.";
   if (reads >= 10) return "No more reads for this storyboard.";
   let text;