ucode-agent 1.34.0 → 1.36.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ucode-agent",
-  "version": "1.34.0",
+  "version": "1.36.0",
   "description": "ucode - a terminal coding agent that reads, edits and runs your code, on NVIDIA and Cohere models.",
   "type": "module",
   "main": "ucode.js",

package/src/core/loop.js

@@ -19,6 +19,7 @@ import { testRunnerFor, relatedCommand, summariseFailures } from './tests.js';
 import { LogWatch } from './livelog.js';
 import { checkHtml } from './htmlcheck.js';
 import { runningServers } from '../tools/shell.js';
+import { beginTurn, undoTurn, changedCount } from './undo.js';
 import { spawn } from 'node:child_process';
 
 import {
@@ -1076,6 +1077,10 @@ export class Agent {
   }
 
   async turn(input) {
+    // From here every file this turn writes keeps a copy of how it was, so
+    // /undo can put the whole turn back.
+    beginTurn();
+    this.lookedThisTurn = false;
     forgetReviews(); // a new request: its apps get a fresh design review
     const images = await this.attachImages(input);
     this.push(images.length
@@ -1642,6 +1647,14 @@ export class Agent {
     // are still built by the tool — the model reads them in the result — they
     // simply do not go on screen.
     if (out.diff?.length) this.ui.diffStat?.(countDiff(out.diff));
+    // A look is the most thorough thing ucode runs — two widths, screenshots,
+    // a designer's review, and now the app actually driven — and it was the
+    // quietest line on screen, saying only that it had happened. Its verdict
+    // goes on the same line, the way a change carries its two numbers.
+    if (call.name === 'look_at_app') {
+      const found = /^(\d+) problem/.exec(out.summary ?? '');
+      this.ui.runStat?.(found ? `${found[1]} to fix` : 'clean');
+    }
     this.push({ role: 'tool', toolCallId: call.id, name: call.name, content: out.content + this.stuckNote(call, { out }) });
   }
 
@@ -1978,9 +1991,59 @@ export class Agent {
     const live = await this.liveErrors();
     if (live) problems.push(live);
 
+    // Then look at it, in the same pass that type-checks — not when the model
+    // remembers to. A check that runs only when it is asked for reports
+    // nothing on exactly the builds that needed it, and this is the only one
+    // that opens the page, presses its buttons and finds out whether any of it
+    // actually works.
+    if (!problems.length) {
+      const seen = await this.lookOnceThisTurn(root, changed);
+      if (seen) problems.push(seen);
+    }
+
     return problems.length ? problems.join('\n\n') : null;
   }
 
+  /**
+   * Open what was just built and report what is wrong with it, once a turn.
+   *
+   * Points at a dev server when one is running; otherwise serves the folder
+   * holding the page that changed, which is the only way the default
+   * three-file starter gets looked at at all — it has no server to point at.
+   * Only for a turn that touched something with a page in it: there is nothing
+   * to open after a change to a utility module.
+   *
+   * Never throws. A browser that will not start is a reason to skip the look,
+   * never a reason to fail the turn that built the app.
+   */
+  async lookOnceThisTurn(root, changed) {
+    if (this.lookedThisTurn) return null;
+
+    const pages = [...changed].filter((f) => /\.(?:html?|tsx|jsx)$/i.test(f));
+    if (!pages.length) return null;
+    this.lookedThisTurn = true;
+
+    try {
+      const { lookAtApp, withStaticServer } = await import('../tools/browser.js');
+      const look = async (url) => {
+        this.ui.toolCall(`Looking at ${url} on a phone and a desktop`);
+        const out = await lookAtApp({ url });
+        const found = /^(\d+) problem/.exec(out.summary ?? '');
+        this.ui.runStat?.(found ? `${found[1]} to fix` : 'clean');
+        return found ? `I opened the app and looked at it:\n\n${out.content}` : null;
+      };
+
+      const server = runningServers().at(-1);
+      if (server?.url) return await look(server.url);
+
+      const html = pages.find((f) => /\.html?$/i.test(f));
+      if (!html) return null;
+      return await withStaticServer(path.dirname(path.resolve(root, html)), look);
+    } catch {
+      return null;
+    }
+  }
+
   /**
    * Anything the running app has complained about since the last look. A dev
    * server knows about a broken import the moment it happens; without this
@@ -2145,6 +2208,7 @@ export class Agent {
       case '/search':   return this.cmdSearch(arg);
       case '/copy':     return this.cmdCopy();
       case '/stats':    return this.cmdStats();
+      case '/undo':     return this.cmdUndo();
       case '/doctor':   return this.cmdDoctor();
       case '/look':     return this.cmdLook(arg);
       case '/deploy':   return this.cmdDeploy(arg);
@@ -2187,9 +2251,33 @@ ${out.content}` });
     }
   }
 
+  /**
+   * Put every file the last turn wrote back the way it was.
+   *
+   * The one thing an agent that edits your files on its own has to have. It
+   * covers the last turn only — the state you want back is almost always the
+   * one that just happened — and it says how many files it touched rather than
+   * listing them, the way everything else here reports work.
+   */
+  async cmdUndo() {
+    const count = changedCount();
+    if (!count) {
+      this.ui.note('nothing to undo — the last turn changed no files.');
+      return;
+    }
+
+    const { restored, removed, failed } = await undoTurn();
+    const parts = [];
+    if (restored.length) parts.push(`${restored.length} file${restored.length === 1 ? '' : 's'} put back`);
+    if (removed.length) parts.push(`${removed.length} removed`);
+    this.ui.write(`  ${theme.ok('✓')} ${parts.join(', ') || 'nothing to do'}`);
+    for (const f of failed) this.ui.write(theme.error(`  could not undo ${f}`));
+  }
+
   cmdHelp() {
     const rows = [
       ['/help', 'this list'],
+      ['/undo', 'put back every file the last turn changed'],
       ['/stats', 'time, steps and tokens this session'],
       ['/doctor', 'check that everything ucode needs is working'],
       ['/look [url]', 'open the running app and report what is on the page'],

package/src/core/provider.js

@@ -765,6 +765,36 @@ async function streamed(request, opts, id) {
  * "path", then "content", then either the next file or the end. Splitting on
  * that shape and escaping the stray quotes gets every file back.
  */
+/**
+ * Which calls can be rebuilt out of broken JSON.
+ *
+ * All three carry file contents — hundreds of lines of HTML, CSS and
+ * JavaScript escaped into a JSON string — which is the one argument shape a
+ * model gets wrong often enough to matter. Everything else is short enough
+ * that a parse failure is a real mistake, worth reporting rather than guessing
+ * around.
+ */
+const SALVAGEABLE = new Set(['write_file', 'batch_write', 'create_app']);
+
+/**
+ * The plain string arguments sitting beside a files array, read off the raw
+ * text when the object as a whole will not parse.
+ *
+ * Only the keys create_app needs, and only from before the files begin, so a
+ * "name" belonging to something nested inside a file cannot be mistaken for
+ * the app's own.
+ */
+function scalarArgs(text) {
+  const at = text.search(/"files"\s*:/);
+  const head = at > 0 ? text.slice(0, at) : text;
+  const out = {};
+  for (const key of ['folder', 'name', 'description', 'template', 'design']) {
+    const hit = new RegExp(`"${key}"\\s*:\\s*"((?:[^"\\\\]|\\\\.)*)"`).exec(head);
+    if (hit) out[key] = hit[1].replace(/\\(["\\/])/g, '$1');
+  }
+  return out;
+}
+
 export function salvageWrites(text) {
   const heads = [...text.matchAll(/"path"\s*:\s*"((?:[^"\\]|\\.)*)"\s*,\s*"content"\s*:\s*"/g)];
   if (!heads.length) return null;
@@ -837,9 +867,17 @@ export function readCall({ id, name, raw, cutOff = false }) {
         }
       } catch { /* beyond general repair — try the file-write shape next */ }
 
-      const salvaged = (name === 'write_file' || name === 'batch_write') ? salvageWrites(text) : null;
+      const salvaged = SALVAGEABLE.has(name) ? salvageWrites(text) : null;
       if (salvaged) {
-        call.args = name === 'write_file' ? salvaged[0] : { files: salvaged };
+        if (name === 'write_file') call.args = salvaged[0];
+        // create_app carries the app in the same { path, content } shape, with
+        // a few plain strings beside it. Losing the entire call because one of
+        // several hundred lines of HTML held a raw newline is how a build ends
+        // with no files at all — which is what it did: refused three times,
+        // the folder never created, the turn over in sixty-six seconds having
+        // produced nothing. The scalars are read back off the same text.
+        else if (name === 'create_app') call.args = { ...scalarArgs(text), files: salvaged };
+        else call.args = { files: salvaged };
         call.repaired = true;
         return call;
       }

package/src/core/undo.js

@@ -0,0 +1,81 @@
+/**
+ * undo.js — what every file looked like before this turn touched it.
+ *
+ * ucode edits files on its own. Until now there was no way back from that: a
+ * turn that went wrong left the work in whatever state it reached, and the
+ * only recovery was git, if the project had git and the user had committed.
+ * An agent that writes to your disk without an undo is asking for a kind of
+ * trust it has not earned.
+ *
+ * So the original of every file is kept the first time a turn writes to it —
+ * the first time only, because the point of an undo is the state before the
+ * turn, not before the last of six edits to the same file. A file that did not
+ * exist is remembered as absent, and undoing removes it again.
+ *
+ * Kept in memory, for one turn. Persisting it would be a different feature
+ * with a different set of questions (how many turns, where, how big), and the
+ * turn you want back is almost always the one that just happened.
+ */
+
+import fs from 'node:fs/promises';
+import path from 'node:path';
+
+/** abs path -> the contents before this turn, or null when it did not exist. */
+let before = new Map();
+let armed = false;
+
+/** A new turn: nothing remembered yet, and from here on writes are recorded. */
+export function beginTurn() {
+  before = new Map();
+  armed = true;
+}
+
+/**
+ * Remember a file as it is now, if this turn has not already seen it.
+ *
+ * Reading before every write costs one stat and one read on files that are
+ * about to be rewritten anyway. Never throws: failing to record an undo is a
+ * reason to have no undo, never a reason to fail the write.
+ */
+export async function remember(abs) {
+  if (!armed || before.has(abs)) return;
+  try {
+    before.set(abs, await fs.readFile(abs, 'utf8'));
+  } catch {
+    before.set(abs, null); // did not exist, so undoing means deleting it
+  }
+}
+
+/** How many files this turn has changed so far. */
+export function changedCount() {
+  return before.size;
+}
+
+/**
+ * Put every file back the way it was, and say what was done.
+ *
+ * Returns { restored, removed, failed } rather than throwing, because a
+ * partial undo is still worth reporting: knowing four of five files went back
+ * is the difference between fixing one thing by hand and wondering.
+ */
+export async function undoTurn() {
+  const out = { restored: [], removed: [], failed: [] };
+
+  for (const [abs, text] of before) {
+    try {
+      if (text === null) {
+        await fs.rm(abs, { force: true });
+        out.removed.push(abs);
+      } else {
+        await fs.mkdir(path.dirname(abs), { recursive: true }).catch(() => {});
+        await fs.writeFile(abs, text, 'utf8');
+        out.restored.push(abs);
+      }
+    } catch (err) {
+      out.failed.push(`${abs}: ${err.message}`);
+    }
+  }
+
+  before = new Map();
+  return out;
+}

package/src/tools/browser.js

@@ -14,6 +14,7 @@
  */
 
 import { promises as fs } from 'node:fs';
+import fsSync from 'node:fs';
 import path from 'node:path';
 import { ToolFailure } from '../core/failure.js';
 import { ask } from '../core/provider.js';
@@ -238,15 +239,32 @@ async function useTheApp(page) {
   let after = await snapshot().catch(() => before);
   if (tried.length && moved(before, after)) return { tried, worked: true };
 
-  // Nothing moved, so try the other half of the same pattern.
-  const button = page.locator('button:not([disabled]), input[type="submit"], [role="button"]').first();
-  if (await button.count().catch(() => 0)) {
-    const label = (await button.innerText().catch(() => '') || '').trim().replace(/\s+/g, ' ').slice(0, 24);
-    const ok = await button.click({ timeout: 2_000 }).then(() => true).catch(() => false);
-    if (ok) {
+  // Nothing moved, so try the other half of the same pattern — the button that
+  // submits, before any other. Taking simply the first button in the document
+  // finds the theme toggle in the header, clicks it, and reports a working app
+  // as dead because switching to dark mode adds no elements.
+  const candidates = [
+    page.locator('form button[type="submit"], form input[type="submit"], button[type="submit"], input[type="submit"]'),
+    page.locator('form button:not([disabled])'),
+    page.locator('button:not([disabled]), [role="button"]'),
+  ];
+
+  const pressed = new Set();
+  for (const group of candidates) {
+    const count = Math.min(await group.count().catch(() => 0), 3);
+    for (let i = 0; i < count; i++) {
+      const button = group.nth(i);
+      const label = (await button.innerText().catch(() => '') || '').trim().replace(/\s+/g, ' ').slice(0, 24);
+      if (pressed.has(label || `#${i}`)) continue;
+      pressed.add(label || `#${i}`);
+
+      const ok = await button.click({ timeout: 2_000 }).then(() => true).catch(() => false);
+      if (!ok) continue;
       await page.waitForTimeout(300);
-      tried.push(`clicked ${label ? `"${label}"` : 'the first button'}`);
+      tried.push(`clicked ${label ? `"${label}"` : 'a button'}`);
+
       after = await snapshot().catch(() => after);
+      if (moved(before, after)) return { tried, worked: true };
     }
   }
 
@@ -254,6 +272,42 @@ async function useTheApp(page) {
   return { tried, worked: moved(before, after) };
 }
 
+/**
+ * Serve a folder over http just long enough to look at it.
+ *
+ * The default starter has no dev server — three files that open straight from
+ * disk — so there was nothing for the checker to point at, and the most
+ * thorough thing ucode runs could not run on the apps it makes most often. A
+ * static server on an ephemeral port costs nothing and closes again the
+ * moment the look is done.
+ */
+export async function withStaticServer(dir, fn) {
+  const http = await import('node:http');
+  const root = path.resolve(dir);
+  const types = {
+    '.html': 'text/html', '.css': 'text/css', '.js': 'text/javascript',
+    '.json': 'application/json', '.svg': 'image/svg+xml', '.png': 'image/png',
+  };
+
+  const server = http.createServer((req, res) => {
+    const rel = (req.url === '/' ? '/index.html' : req.url).split('?')[0];
+    const file = path.join(root, decodeURIComponent(rel));
+    if (!file.startsWith(root)) { res.writeHead(403); res.end(); return; }
+    fsSync.readFile(file, (err, buf) => {
+      if (err) { res.writeHead(404); res.end('not found'); return; }
+      res.writeHead(200, { 'content-type': types[path.extname(file).toLowerCase()] ?? 'text/plain' });
+      res.end(buf);
+    });
+  });
+
+  await new Promise((resolve) => server.listen(0, '127.0.0.1', resolve));
+  try {
+    return await fn(`http://127.0.0.1:${server.address().port}`);
+  } finally {
+    server.close();
+  }
+}
+
 export async function lookAtApp({ url, paths = ['/'] }) {
   const base = String(url ?? '').trim().replace(/\/+$/, '');
   if (!LOCAL.test(`${base}/`)) {

package/src/tools/files.js

@@ -8,6 +8,7 @@
  */
 
 import { promises as fs } from 'node:fs';
+import { remember } from '../core/undo.js';
 import path from 'node:path';
 import { ToolFailure } from '../core/failure.js';
 import {
@@ -297,6 +298,7 @@ async function put(target, content, { diffMax = 16 } = {}) {
 
   try {
     await fs.mkdir(path.dirname(target.abs), { recursive: true });
+    await remember(target.abs);
     await fs.writeFile(target.abs, content, 'utf8');
   } catch (err) {
     throw fsFailure(err, attempted, target.show);
@@ -555,6 +557,7 @@ export async function editFile({ path: p, old_string, new_string }) {
   });
 
   try {
+    await remember(target.abs);
     await fs.writeFile(target.abs, text, 'utf8');
   } catch (err) {
     throw fsFailure(err, attempted, target.show);
@@ -628,6 +631,7 @@ export async function multiEdit({ path: p, edits }) {
   }
 
   try {
+    await remember(target.abs);
     await fs.writeFile(target.abs, text, 'utf8');
   } catch (err) {
     throw fsFailure(err, attempted, target.show);
@@ -716,7 +720,8 @@ export async function editFiles({ files }) {
 
   for (const { target, text } of planned) {
     try {
-      await fs.writeFile(target.abs, text, 'utf8');
+      await remember(target.abs);
+    await fs.writeFile(target.abs, text, 'utf8');
     } catch (err) {
       throw fsFailure(err, `editing ${target.show}`, target.show);
     }

package/src/tools/scaffold.js

@@ -131,6 +131,48 @@ const TOKEN_FILE = { 'plain-html': 'styles.css' };
  * a stylesheet with no :root variables at all gets the starter's block put
  * back above it, where every rule underneath can reach it.
  */
+const ASSET_REF = /\b(href|src)=("|')(?!https?:|\/\/|\/|data:|#|mailto:|tel:)([^"']+)\2/g;
+
+/**
+ * Take the app's own folder back out of its own links.
+ *
+ * create_app wants paths relative to the project root — "todo/index.html" —
+ * because that is where every other file tool works from. The model then
+ * carries the same prefix into the markup and writes
+ * <link href="todo/styles.css"> inside todo/index.html, where it resolves to
+ * todo/todo/styles.css and 404s. The page comes up as bare markup with no
+ * stylesheet and no script: no design, no behaviour, nothing in the console
+ * but two failed requests.
+ *
+ * It is the tool's own convention leaking into the file, so the tool takes it
+ * back out. Only a leading "<folder>/" on a relative reference, which inside
+ * that folder is always wrong — absolute paths, URLs, data: and anchors are
+ * left exactly as they are.
+ */
+async function unprefixOwnFolder(appDir, written) {
+  const prefix = `${path.basename(appDir)}/`;
+  const fixed = [];
+
+  for (const abs of written) {
+    if (!/\.html?$/i.test(abs)) continue;
+    const text = await fs.readFile(abs, 'utf8').catch(() => null);
+    if (text === null) continue;
+
+    let hits = 0;
+    const next = text.replace(ASSET_REF, (all, attr, quote, value) => {
+      if (!value.startsWith(prefix)) return all;
+      hits++;
+      return `${attr}=${quote}${value.slice(prefix.length)}${quote}`;
+    });
+
+    if (hits) {
+      await fs.writeFile(abs, next, 'utf8');
+      fixed.push(`${path.relative(appDir, abs).split(path.sep).join('/')} (${hits})`);
+    }
+  }
+  return fixed;
+}
+
 async function keepDesignTokens(appDir, template, written, starterCss) {
   const rel = TOKEN_FILE[template];
   if (!rel || !starterCss) return null;
@@ -318,7 +360,8 @@ export async function createApp({ folder, name, description, template = 'plain-h
   const mine = given;
   const wrote = mine.length ? await batchWrite({ files: mine }) : null;
   const written = new Set(mine.map((f) => resolveIn(f.path, 'create_app', 'files').abs));
-  const keptTokens = await keepDesignTokens(target.abs, template, written, starterCss);
+  const keptTokens = await keepDesignTokens(target.abs, template, written, starterCss);
+  const relinked = await unprefixOwnFolder(target.abs, written);
 
   // The starter's own files, in full, so there is never a reason to read them
   // back — and only the ones this call did not already write over. A read is
@@ -335,6 +378,13 @@ export async function createApp({ folder, name, description, template = 'plain-h
     `Created ${target.show} from the ${template} starter — ${copied.length} files, already known to build.\n` +
       (look ? `Design: the ${look.name} preset (${look.summary}), font ${look.fonts?.sans ?? 'Geist'}.\n` : '') +
       (wrote ? `\nYour ${mine.length} file${mine.length === 1 ? '' : 's'}:\n${wrote.content}\n` : '') +
+      (relinked.length
+        ? `\nFixed in ${relinked.join(', ')}: links that began with "${path.basename(target.abs)}/". ` +
+          'Paths in "files" are relative to the project root, but a link inside a page is ' +
+          'relative to that page — so "index.html" beside "styles.css" links to it as ' +
+          '"styles.css", never "app/styles.css". Written that way the stylesheet and the ' +
+          'script 404 and the page comes up as bare markup.\n'
+        : '') +
       (keptTokens
         ? `\nYour ${keptTokens} arrived with no :root block, so the starter's was kept above it — ` +
           'the palette, the spacing scale (--s1 to --s5), the radius and the motion timings. ' +

package/src/ui/screen.js

@@ -60,7 +60,7 @@ export function isLabel(text) {
 export const COMMANDS = [
   '/help', '/model', '/models', '/session', '/sessions', '/resume',
   '/new', '/remember', '/skills', '/clear', '/search', '/copy', '/exit',
-  '/stats', '/doctor', '/deploy', '/look',
+  '/stats', '/doctor', '/deploy', '/look', '/undo',
 ];
 
 // ANSI ----------------------------------------------------------------------
@@ -473,6 +473,19 @@ export class Screen {
    * there buries the answer under a copy of something already on disk, so
    * what is kept is the shape of the change: how much arrived, how much left.
    */
+  /**
+   * A one-word verdict on the step that just ran — "clean", "3 to fix".
+   *
+   * Same rule as diffStat: it goes on the line that named the step. Nothing
+   * goes underneath a bullet, and a result line per tool doubles the height of
+   * the transcript to say "ok".
+   */
+  runStat(text) {
+    if (!this.run || !text) return;
+    this.run.stat = text;
+    this.paintRun();
+  }
+
   diffStat({ added = 0, removed = 0 } = {}) {
     if (!this.run) return;
     this.run.added += added;

package/src/ui/theme.js

@@ -481,10 +481,16 @@ export const groupTarget = (label) => String(label ?? '').trim().split(/\s+/).sl
  * asLabel() already: run that over this and its regexes would be reading
  * escape sequences instead of the last word.
  */
-export function runLine({ label, count = 1, targets = [], added = 0, removed = 0 }) {
+export function runLine({ label, count = 1, targets = [], added = 0, removed = 0, stat = '' }) {
+  // What came of the step, in the same place a change puts its two numbers:
+  // on the line that named the step, never underneath it. A look that found
+  // three things to fix is the one fact worth carrying out of a look, and
+  // without it the most thorough check ucode runs is the quietest thing on
+  // screen — it opens the app at two widths, screenshots both and has them
+  // reviewed, and said nothing about any of it.
   const counts = added || removed
     ? ` ${chalk.hex('#3fb950')(`+${added}`)} ${chalk.hex('#f2939c')(`-${removed}`)}`
-    : '';
+    : (stat ? `  ${sky(stat)}` : '');
   if (count <= 1) return `${paintStep(label)}${counts}`;
 
   const g = GROUPS[groupKind(label)];