demobites 1.30.2 → 1.32.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "demobites",
-  "version": "1.30.2",
+  "version": "1.32.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

@@ -394,7 +394,10 @@ const postFrame = async () => {
     // the JPEG OUTSIDE the page with ffmpeg. No ffmpeg → no thumbnail, never a glitch.
     const { data } = await within(frameCdp.send("Page.captureScreenshot", { format: "jpeg", quality: 60 }), 4000);
     const small = await within(shrinkJpeg(Buffer.from(data, "base64"), 480), 4000);
-    if (small) await within(postEvent("frame", { ...frameStep, jpeg: small.toString("base64") }), 8000);
+    // A BLANK STILL IS NO STILL (founder 2026-10-18: a white box with the red pill while the first page loaded). A
+    // 480 px JPEG of a white page is under 3 KB; a page with anything on it is well over. The app keeps the last real
+    // still, or says the page is loading.
+    if (small && small.length > 3000) await within(postEvent("frame", { ...frameStep, jpeg: small.toString("base64") }), 8000);
   } catch (e) {
     if (!frameWarned) { frameWarned = true; console.error(`frame: dropped (${String(e?.message ?? e).split("\n")[0]})`); }
   } finally { framing = false; }
@@ -856,7 +859,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 }); frameStep = { n: rec.n, N }; void postFrame(); }
+    { const N = STORYBOARD.steps.length, filled = Math.round((rec.n / N) * 20); process.stdout.write(`Recording  ${"█".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
@@ -1319,14 +1322,36 @@ if (connectedBrowser) { try { await connectedBrowser.close(); } catch {} }
 if (ownedBrowser) { try { await ownedBrowser.close(); } catch {} }
 fs.writeFileSync(path.join(DIR, "manifest.json"), JSON.stringify(manifest, null, 2));
 if (failure) {
-  console.error(`TAKE FAILED at step ${manifest.steps.length + 1}: ${failure.message}`);
+  const n = manifest.steps.length + 1;
+  const N = STORYBOARD.steps.length;
+  const st = STORYBOARD.steps[n - 1] || {};
+  console.error(`TAKE FAILED at step ${n}: ${failure.message}`);
   console.error("Partial raw.webm + manifest.json saved in", DIR);
-  process.exit(1);
+  // THE REASON REACHES THE PERSON (founder 2026-10-18, "Recording did not finish" with nothing else: "please
+  // analyze"): the step, its words, and what the camera could not do, in plain words. Exit 3 tells plan.mjs the
+  // failure is already posted.
+  const m = /no visible target for (.+)$/.exec(failure.message);
+  const what = m ? `the camera could not find ${describeTarget(m[1])} on the page` : failure.message.replace(/\s+/g, " ").slice(0, 160);
+  const label = st.name || st.label || (st.selector ? describeTarget(st.selector) : st.action) || "";
+  await postEvent("failed", { message: `The recording stopped at step ${n} of ${N}${label ? ` (${label})` : ""}: ${what}.`, step: n, N, reason: failure.message.slice(0, 300) });
+  process.exit(3);
 }
 const cursorKinds = [...new Set(mouseEvents.map((e) => e.cursor))].join(", ");
+/** A selector in the person's words: has-text('X') → "X"; aria-label → its words; else the selector itself. */
+function describeTarget(sel) {
+  const t = /has-text\(['"](.+?)['"]\)/.exec(sel)?.[1] || /aria-label=['"](.+?)['"]/.exec(sel)?.[1];
+  if (!t) return `"${sel}"`;
+  const kind = /menuitem/.test(sel) ? "in the menu" : /role=tab/.test(sel) ? "among the tabs" : /button/.test(sel) ? "as a button" : "";
+  return `"${t}"${kind ? ` ${kind}` : ""}`;
+}
 console.log(
   `DONE raw.webm + manifest.json in ${DIR} — ${manifest.duration.toFixed(1)}s, ` +
   `${manifest.steps.length} steps, ${manifest.shots.length} camera shots, ` +
   `${mouseEvents.length} mouse events (${cursorKinds})` +
   `${BURN_CURSOR ? ", cursor BURNED IN" : ", cursor rendered by the studio"}`,
 );
+// THE EXIT IS BOUNDED (2026-10-18): the take is on disk and the manifest written; nothing after this line is work.
+// The clock says when we got here, and a timer that holds no reference ends the process within 3 s should anything
+// (a browser handle, a socket) keep the event loop alive — the founder's take sat here for 46 s.
+console.log(`${new Date().toISOString()} take saved; exiting`);
+setTimeout(() => process.exit(0), 3000).unref();

package/skill/scripts/plan.mjs

@@ -218,7 +218,7 @@ const firstMessage = async () => {
     // storyboard is the base; the note says what to keep an eye on; the probe finds what moved.
     job.retake_of && job.storyboard
       ? `## This is a retake\nThe person wants the same demo filmed again, the same length and the same shots, because the app changed since. Their note: "${(job.retake_note || "no note").replace(/"/g, "'")}". ${job.storyboard.storyboard ? "Start from the previous storyboard below: keep its steps and its lines; probe it; fix only what no longer resolves or what the note names; then submit_storyboard. Never explore when the probe passes." : "Only the previous storyboard's lines survive (below): rebuild the same steps with the same lines, find the controls again, probe, then submit_storyboard."}\n\n## The previous storyboard\n${JSON.stringify(job.storyboard.storyboard ?? job.storyboard.steps ?? job.storyboard)}`
-      : codeOn ? `Write the storyboard, probe it, fix it, probe again, then submit_storyboard.` : `There is no code: explore first (explore from the starting address, looking_for = the brief's nouns), then write the storyboard, probe it, fix it, probe again, then submit_storyboard.`,
+      : codeOn ? `Write the storyboard from the page's own words, probe it, fix it, probe again, then submit_storyboard. Read a file only when the page's words do not name a control you need; never as a first move. You have at most 4 dry runs and 3 minutes from the first one; after that, hand in what passed and name in 'unsure' what you could not find.` : `There is no code: explore first (explore from the starting address, looking_for = the brief's nouns), then write the storyboard, probe it, fix it, probe again, then submit_storyboard. You have at most 4 dry runs and 3 minutes from the first one; after that, hand in what passed and name in 'unsure' what you could not find.`,
   ];
   return parts.join("\n\n");
 };
@@ -226,6 +226,16 @@ const firstMessage = async () => {
 let storyboard = null;
 let creates = "";
 const messages = [{ role: "user", content: [{ type: "text", text: await firstMessage() }] }];
+// THE PLANNING CAP (founder 2026-10-18, a 13-minute storyboard: "inconceivable"): the planner gets FOUR dry runs, or
+// three minutes from the first one, whichever comes first. After that no probe runs; the next move is the storyboard
+// as it stands, with the steps it could not find named in `unsure`, so the person answers the question instead of
+// waiting while it rewrites and retries (that job: 18 dry runs, 13 model turns).
+const CAP_PROBES = 4;
+const CAP_MS = 3 * 60 * 1000;
+let probes = 0;
+let firstProbeAt = 0;
+const capped = () => probes >= CAP_PROBES || (firstProbeAt && Date.now() - firstProbeAt > CAP_MS);
+const CAP_TEXT = () => `PLANNING CAP REACHED (${probes} dry run${probes === 1 ? "" : "s"}, ${Math.round((Date.now() - (firstProbeAt || Date.now())) / 1000)} s since the first). No more dry runs, no more reading. Hand in the storyboard NOW with submit_storyboard: keep every step that passed; a step that failed becomes a hover or a settle on the nearest element the page does have, or goes; write ONE short sentence in \`unsure\` naming what you could not find on the page (the step and the control), so the person can tell you where it is. The person is waiting.`;
 const plan = async () => {
   say("Writing the storyboard…");
   storyboard = null;
@@ -255,12 +265,20 @@ const plan = async () => {
         else if (u.name === "harvest_words") { say(`Reading the app's own words on ${(input.urls || []).length} page${(input.urls || []).length === 1 ? "" : "s"}…`); out = harvest(input.urls); }
         else if (u.name === "explore") { say(`Walking the app from ${where(input.from)}, looking for ${String(input.looking_for || "the brief's words").slice(0, 60)}…`); out = explore(input.from, input.looking_for, input.depth); }
         else if (u.name === "screenshot") { say(`Looking at ${where(input.url)}…`); out = screenshot(input.url); }
-        else if (u.name === "probe") { say(`Dry run of the storyboard, ${(input.storyboard?.steps || []).length} steps…`); out = probe(input.storyboard); }
+        else if (u.name === "probe") {
+          if (capped()) out = CAP_TEXT();
+          else {
+            probes += 1; if (!firstProbeAt) firstProbeAt = Date.now();
+            say(`Dry run of the storyboard, ${(input.storyboard?.steps || []).length} steps… (${probes} of ${CAP_PROBES})`);
+            out = probe(input.storyboard);
+            if (capped()) out += `\n\n${CAP_TEXT()}`;
+          }
+        }
         else if (u.name === "submit_storyboard") {
           say("Handing in the storyboard…");
           const bad = validate(input.storyboard);
           if (bad) out = `Not accepted: ${bad}`;
-          else { storyboard = input.storyboard; creates = typeof input.creates === "string" ? input.creates : ""; out = "Accepted."; }
+          else { storyboard = input.storyboard; creates = typeof input.creates === "string" ? input.creates : ""; if (typeof input.unsure === "string" && input.unsure.trim()) storyboard.unsure = input.unsure.trim().slice(0, 240); out = "Accepted."; }
         } else out = `Unknown tool ${u.name}`;
       } catch (e) { out = `Tool failed: ${e.message}`; }
       results.push({ type: "tool_result", tool_use_id: u.id, content: typeof out === "string" ? [{ type: "text", text: out }] : out });
@@ -303,13 +321,19 @@ try {
 
 // ── The take ─────────────────────────────────────────────────────────────
 const sbFile = path.join(dir, "storyboard.json");
+// EVERY PHASE IS STAMPED (founder's take of 2026-10-18: 46 s between the video on disk and the trim, unexplained;
+// "why in God's name does it take us so long?"): the clock before each step and the seconds it took after, so the
+// next take's log names where the minutes go.
 const step = async (name, args, what) => {
+  const t0 = Date.now();
+  console.log(`  ${new Date(t0).toISOString()} ${what}…`);
   const r = spawnSync("node", [script(name), ...args], { cwd: process.cwd(), stdio: "inherit", env: process.env });
-  if (r.status !== 0) { console.error(`  ! ${name} failed (exit ${r.status})`); await postEvent("failed", { message: `${what} did not finish` }); process.exit(1); }
+  console.log(`  ${new Date().toISOString()} ${what}: ${((Date.now() - t0) / 1000).toFixed(1)}s`);
+  if (r.status !== 0) { console.error(`  ! ${name} failed (exit ${r.status})`); if (r.status !== 3) await postEvent("failed", { message: `${what} did not finish` }); process.exit(1); }
 };
 const sb = JSON.parse(fs.readFileSync(sbFile, "utf8"));
 if (Array.isArray(sb.prep) && sb.prep.length) await step("cleanup.mjs", [dir, "--prep"], "Preparing the data");
-await step("record.mjs", [dir, sbFile], "Filming");
+await step("record.mjs", [dir, sbFile], "Recording");
 if (Array.isArray(sb.cleanup) && sb.cleanup.length) await step("cleanup.mjs", [dir], "Putting the data back");
 await step("trim.mjs", [dir], "Trimming the take");
 await step("calibrate.mjs", [dir], "Measuring the take");