prolog-notebook 0.5.0 → 0.5.1

package/CHANGELOG.md

@@ -1,5 +1,42 @@
 # Changelog
 
+## [0.5.1] — 2026-08-30
+
+Everything here came from one field report: a chapter written with the tool rather than a test
+written against it.
+
+### Fixed
+
+- **`view` bound quietly behind a squatter on the same port.** A stale
+  `python3 -m http.server --bind ::` holds `*:8777` on IPv6; binding `127.0.0.1:8777` on IPv4
+  does not collide with it, so `EADDRINUSE` never fired and the auto-bump never ran. `localhost`
+  then resolves to `::1` first and the reader gets somebody else's directory listing where a
+  chapter should be. The port is now connect-tested on **both stacks** before binding, because
+  *can I bind* and *will the reader reach me* are different questions.
+
+- **`view` printed its URL on stderr**, where a wrapper never saw it — which is how somebody
+  came to type `localhost` by hand. It is the command's output and is on stdout now; `view`
+  writes no notebook and no data there, so nothing can be corrupted by it.
+
+- **`view` and `build` never looked for an update.** The offer went into the `run` path first
+  and stayed there. Every command that does real work now goes through one door, always before
+  the work — the only point at which the answer can change the outcome.
+
+- **A prediction released the hold on blur, not on typing.** A reader who typed their prediction
+  and looked up saw nothing happen, and the link between *I wrote something* and *the answers
+  appeared* was broken by a pause with no cause. Debounced `input` at 1.2 s now, with `change`
+  kept so leaving the box is still immediate.
+
+- **The console was not clean, and this audience opens the console.** A `favicon.ico` 404 on
+  every load — now a `data:` URI carrying the notebook's own `?-` prompt — and an issues-panel
+  warning for every form field on the page, all of which were anonymous. Every field has an id:
+  `src-<cell>`, `goal-<cell>`, `predict-<n>`.
+
+- **A missing browser opener took the whole command down.** `spawn` reports that
+  asynchronously, so the `try/catch` around it caught nothing and an unhandled `'error'` event
+  killed `view` after the server had started. `start` on Windows is a shell builtin and was
+  never going to work spawned by name; it goes through `cmd` now.
+
 ## [0.5.0] — 2026-08-30
 
 **The CLI can show a notebook.** Until now the only way to see one running was to clone this

package/bin/prolog-notebook.mjs

@@ -4,7 +4,6 @@
 // Code "run all" and a future --check get the same behaviour without going
 // through a shell (869ectt38, 869ectt3e).
 import { createRequire } from 'node:module';
-import { spawn } from 'node:child_process';
 import { copyFileSync, mkdirSync, readFileSync, writeFileSync } from 'node:fs';
 import { basename, dirname, join, resolve } from 'node:path';
 import { parse, NotebookError } from '../src/format.js';
@@ -16,7 +15,7 @@ import { confirm, describeInstall, globalRoot, install, relaunch, upgradePlan }
 import { exportSource } from '../src/export.js';
 import { runNotebook, DEFAULT_LIMIT } from '../src/run.js';
 import { buildFiles } from '../src/build.js';
-import { serve } from '../src/serve.js';
+import { openInBrowser, serve } from '../src/serve.js';
 
 // The engine is imported WHERE IT IS USED, never at the top. src/node.js pulls in
 // 5.9 MB of WebAssembly at module scope, so a static import here would mean that
@@ -141,6 +140,38 @@ function canAsk() {
   return Boolean(process.stdin.isTTY && process.stderr.isTTY);
 }
 
+/**
+ * The offer, BEFORE the command does anything — which is the only place it can
+ * change the outcome. Afterwards the files are written, the server is up, and a
+ * newer version has nothing left to do.
+ *
+ * Every command that does real work goes through here: `run`, `view` and
+ * `build`. It went in the run path first and stayed there, so `view` — the
+ * command somebody is most likely to leave running — was the one that never
+ * looked.
+ *
+ * It costs a network round trip once a day, not once a run: the rest of the day
+ * is a file read.
+ *
+ * @returns {Promise<number|null>} an exit code when the command has been handed
+ *   to a newer version, null to carry on here.
+ */
+async function upgradeFirst({ quiet = false, asked = false } = {}) {
+  if (!canAsk() || (quiet && !asked)) return null;
+  const ahead = await updateNotice({ version: VERSION, force: asked })
+    .catch(() => ({ message: null, newer: null }));
+  if (ahead.message) process.stderr.write(`${ahead.message}\n`);
+  if (!ahead.newer || !(await confirm('Update and continue on the new version?'))) return null;
+  if ((await upgrade(ahead.newer)) !== 0) {
+    process.stderr.write('Carrying on with the version you have.\n');
+    return null;
+  }
+  process.stderr.write('Continuing on the new version.\n');
+  // The path has not changed — npm replaced what is behind it — so this is the
+  // same command, running the bytes that have just arrived.
+  return relaunch(process.argv);
+}
+
 async function offerUpgrade(newer) {
   if (!canAsk()) {
     // Nobody to ask, so say what to type instead. `prolog-notebook upgrade`
@@ -220,30 +251,9 @@ async function main(argv) {
   }
   if (!options.quiet) process.stderr.write(`${RUNAWAY_WARNING}\n`);
 
-  // BEFORE THE WORK, when there is somebody to ask — because the point of asking
-  // is to run the NEW version, and that is only possible while there is still
-  // something to run. Afterwards the files are written and the answer comes too
-  // late to change them.
-  //
-  // It costs a network round trip once a day, not once a run: the rest of the day
-  // is a file read. Measured at 25-120 ms against npm, against a run that spends
-  // seconds in Prolog.
-  if (canAsk() && !options.quiet) {
-    const ahead = await updateNotice({ version: VERSION, force: asked })
-      .catch(() => ({ message: null, newer: null }));
-    if (ahead.message) process.stderr.write(`${ahead.message}\n`);
-    if (ahead.newer && await confirm('Update and continue on the new version?')) {
-      if ((await upgrade(ahead.newer)) === 0) {
-        process.stderr.write('Continuing on the new version.\n');
-        // The path has not changed — npm replaced what is behind it — so this is
-        // the same command, running the bytes that have just arrived.
-        return relaunch(process.argv);
-      }
-      process.stderr.write('Carrying on with the version you have.\n');
-    }
-    // Asked and answered: the check below has nothing left to say.
-    checked = true;
-  }
+  const jump = await upgradeFirst({ quiet: options.quiet, asked });
+  if (jump !== null) return jump;
+  checked = canAsk() && (!options.quiet || asked);
 
   // STARTED NOW, READ AT THE END. The registry is somebody else's machine on
   // somebody else's network, and none of that should stand between the reader
@@ -312,6 +322,12 @@ async function page(command, args) {
     return 2;
   }
 
+  // The same offer the run path makes, and for the same reason: a server about to
+  // start, or a directory about to be written, is work that a newer version
+  // should be doing.
+  const jump = await upgradeFirst();
+  if (jump !== null) return jump;
+
   const file = files[0];
   let built;
   try {
@@ -336,26 +352,20 @@ async function page(command, args) {
   }
 
   const server = await serve(built, { port: options.port });
-  process.stderr.write(`${basename(file)} at ${server.url}\n`);
+  // THE URL IS THIS COMMAND'S OUTPUT. `view` writes no notebook and no data to
+  // stdout, so there is nothing for it to corrupt — and a URL on stderr is a URL
+  // a wrapper does not see, which is how somebody came to type localhost by hand
+  // and land on another server entirely (869ernmvh).
+  process.stdout.write(`${server.url}\n`);
   if (server.port !== options.port) {
-    process.stderr.write(`(${options.port} was taken)\n`);
+    process.stderr.write(`${options.port} was already answering — using ${server.port} instead.\n`);
   }
-  process.stderr.write('Ctrl-C to stop.\n');
+  process.stderr.write(`${basename(file)} is at ${server.url} — Ctrl-C to stop.\n`);
   if (options.open) openInBrowser(server.url);
   // Deliberately never resolves: the server is the command.
   return new Promise(() => {});
 }
 
-/** Hand the URL to whatever the desktop uses. Failure is not worth reporting. */
-function openInBrowser(url) {
-  const opener = { darwin: 'open', win32: 'start' }[process.platform] ?? 'xdg-open';
-  try {
-    spawn(opener, [url], { stdio: 'ignore', detached: true }).unref();
-  } catch {
-    // No desktop, or no opener: the URL is on screen either way.
-  }
-}
-
 async function runFile(file, session, options) {
   const name = basename(file);
   let notebook;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "prolog-notebook",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "Jupyter-style notebooks for Prolog. Runs in the browser, installs nothing.",
   "type": "module",
   "main": "./src/node.js",

package/src/build-info.json

@@ -1,4 +1,4 @@
 {
-  "commit": "084182f",
-  "built": "2026-08-30 16:32:07 UTC"
+  "commit": "3ed80f2",
+  "built": "2026-08-30 17:12:10 UTC"
 }

package/src/build.js

@@ -23,6 +23,20 @@ export const RUNTIME = [
   'clauses.js', 'export.js', 'format.js', 'version.js',
 ];
 
+/**
+ * The notebook's own prompt, `?-`, as a tab icon.
+ *
+ * A data: URI rather than a file, because the alternative is a favicon.ico 404 on
+ * every single load and this audience opens the console (869ernmxe). An SVG so it
+ * scales to whatever size the tab wants.
+ */
+const FAVICON = encodeURIComponent(
+  '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">'
+  + '<rect width="32" height="32" rx="7" fill="#faf7f0"/>'
+  + '<text x="16" y="23" font-family="ui-monospace,Menlo,monospace" font-size="19"'
+  + ' font-weight="600" fill="#8a3b1e" text-anchor="middle">?-</text></svg>',
+);
+
 /** The one engine file: the bundle carries its own data. */
 export const ENGINE = 'swipl-bundle.js';
 
@@ -80,6 +94,7 @@ function page(notebook) {
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>${escapeHtml(titleOf(notebook))}</title>
+<link rel="icon" href="data:image/svg+xml,${FAVICON}">
 <link rel="stylesheet" href="notebook.css">
 </head>
 <body>

package/src/notebook.js

@@ -25,6 +25,14 @@ let serial = 0;
 let panels = 0;
 
 /** Absolute, never relative: "3 minutes ago" is wrong the moment it is written. */
+/**
+ * How long a reader may stop typing before a prediction counts as written.
+ *
+ * Long enough that a first keystroke does not reveal the answers, short enough
+ * that somebody who has finished sees the consequence of finishing.
+ */
+const PREDICTION_PAUSE = 1200;
+
 function clock(date = new Date()) {
   return date.toLocaleTimeString(undefined, { hour12: false });
 }
@@ -1294,11 +1302,31 @@ function mountQuery(cell, options, bus, { above = [], below = [], prediction = n
 
   if (held) {
     hidden = true;
-    // `change` rather than `input`: it fires when they leave the box, so the
-    // answers do not appear under a reader who is still mid-sentence. An empty
-    // box is not a prediction, so it does not end the wait.
-    prediction?.addEventListener('change', () => {
+    /**
+     * AS THEY WRITE, not when they leave the box.
+     *
+     * This listened on `change` alone, which fires on blur — so a reader who
+     * typed their prediction and looked up saw nothing happen, and the link
+     * between "I wrote something" and "the answers appeared" was broken by a
+     * pause with no cause (869ernmzh). The original reasoning was about the
+     * FIRST KEYSTROKE and it over-corrected: they have committed as soon as they
+     * have written something.
+     *
+     * Debounced, so one character does not reveal the chapter and a reader who is
+     * still typing is not interrupted. `change` stays as well, so leaving the box
+     * is immediate. An empty box is still not a prediction.
+     */
+    const release = () => {
       if (held && prediction.value.trim() !== '') setHidden(false);
+    };
+    let pause = null;
+    prediction?.addEventListener('input', () => {
+      clearTimeout(pause);
+      pause = setTimeout(release, PREDICTION_PAUSE);
+    });
+    prediction?.addEventListener('change', () => {
+      clearTimeout(pause);
+      release();
     });
   }
 

package/src/render.js

@@ -85,7 +85,7 @@ export function escapeHtml(text) {
  * @param {{variant: string, title: string, body: string}} cell
  * @returns {string}
  */
-export function renderContainer(cell) {
+export function renderContainer(cell, ordinal = 1) {
   switch (cell.variant) {
     case 'margin':
       // The whole note lives in the head line — `> [!margin] text with no body` —
@@ -122,7 +122,7 @@ function joinHeadAndBody(cell) {
  * markup for a place to answer it. The reveal is a <details> so that it still
  * works, unclicked, on the GitHub page.
  */
-function renderPredict(cell) {
+function renderPredict(cell, ordinal = 1) {
   const { before, summary, reveal } = splitReveal(cell.body);
   const parts = [];
   if (cell.title) parts.push(`<h3>${renderInline(cell.title)}</h3>`);
@@ -131,7 +131,11 @@ function renderPredict(cell) {
   // the format has no spelling for a per-prediction one, and inventing an
   // attribute for it would be a format change to save one line of prose — the
   // author's own question is directly above it and says what to write.
-  parts.push('<textarea placeholder="your prediction…" spellcheck="false"></textarea>');
+  // An id, because a form field without one is a warning in every browser's
+  // issues panel and this audience opens the issues panel (869ernmxe). Minted
+  // from position, since a container carries no id in the model — and stable for
+  // a given chapter, which is what a saved prediction will need (869ectt5d).
+  parts.push(`<textarea id="predict-${ordinal}" placeholder="your prediction…" spellcheck="false"></textarea>`);
   if (reveal !== null) {
     parts.push(`<details>\n<summary>${escapeHtml(summary)}</summary>\n${renderProse(reveal)}\n</details>`);
   }
@@ -177,7 +181,7 @@ export function renderProgram(cell) {
   <div class="bar">program<span class="spacer"></span><span class="status"></span>
     <button data-act="reset" disabled>reset</button>
     <button class="primary" data-act="consult">Consult</button></div>
-  <textarea spellcheck="false">${escapeHtml(cell.source)}</textarea>
+  <textarea id="src-${escapeHtml(cell.id)}" spellcheck="false">${escapeHtml(cell.source)}</textarea>
 </div>`;
 }
 
@@ -217,7 +221,8 @@ export function renderQuery(cell, options = {}) {
     <button data-act="next" disabled>; next</button>
     <button data-act="all" disabled>all</button>
     <button data-act="stop" disabled>stop</button></div>
-  <div class="prompt"><span>?-</span><input value="${escapeHtml(cell.goal)}" spellcheck="false"></div>
+  <div class="prompt"><span>?-</span>`
+    + `<input id="goal-${escapeHtml(cell.id)}" value="${escapeHtml(cell.goal)}" spellcheck="false"></div>
   <div class="out">${renderSavedOutput(cell, { stale })}</div>
 </div>`;
 }
@@ -305,7 +310,7 @@ export function renderCell(cell, options = {}) {
     case 'markdown':
       return renderProse(cell.source);
     case 'container':
-      return renderContainer(cell);
+      return renderContainer(cell, options.ordinal);
     case 'program':
       return renderProgram(cell);
     case 'query':
@@ -333,7 +338,9 @@ export function renderNotebook(notebook) {
   const parts = [];
   const kicker = renderKicker(notebook.frontMatter);
   if (kicker) parts.push(kicker);
+  let predictions = 0;
   for (const cell of notebook.cells) {
+    if (cell.kind === 'container' && cell.variant === 'predict') predictions += 1;
     // Staleness is decided here rather than in renderQuery, because it is a fact
     // about the cell's PLACE in the notebook — the program cells above it — and a
     // query cell on its own cannot know it. Computed before first paint: a 64-bit
@@ -348,7 +355,7 @@ export function renderNotebook(notebook) {
     const rerun = cell.kind === 'query'
       ? cell.rerun ?? notebook.frontMatter.get('rerun') ?? 'manual'
       : null;
-    parts.push(renderCell(cell, { stale, rerun }));
+    parts.push(renderCell(cell, { stale, rerun, ordinal: predictions }));
   }
   return `${parts.join('\n\n')}\n`;
 }

package/src/serve.js

@@ -8,8 +8,10 @@
 // A server of about forty lines rather than a dependency: it answers GET for a
 // fixed set of paths that this process generated, and 404s everything else. It
 // is not a static file server and must not become one.
+import { spawn } from 'node:child_process';
 import { createReadStream } from 'node:fs';
 import { createServer } from 'node:http';
+import { connect } from 'node:net';
 
 const TYPES = {
   '.html': 'text/html; charset=utf-8',
@@ -34,6 +36,15 @@ export function contentType(name) {
  * @returns {Promise<{url: string, port: number, close: () => Promise<void>}>}
  */
 export async function serve(files, { port = 8777, host = '127.0.0.1' } = {}) {
+  // ASK WHETHER ANYBODY IS THERE, on both stacks, before binding to one of them.
+  //
+  // An IPv6 wildcard listener — `python3 -m http.server --bind ::` — does not
+  // collide with an IPv4 loopback bind, so EADDRINUSE never fires and the bind
+  // succeeds. `localhost` then resolves to ::1 first, and the reader gets the
+  // other server's directory listing while this one sits unreachable on
+  // 127.0.0.1 with nothing anywhere saying why (869ernmvh). Found by somebody
+  // authoring their first chapter, which is exactly where it would be found.
+  if (port !== 0 && await occupied(port)) port = 0;
   const server = createServer((request, response) => {
     // Only GET, and only the names this process generated: the path never
     // reaches the filesystem, so there is nothing for a `..` to escape into.
@@ -78,3 +89,53 @@ function listen(server, port, host) {
     server.listen(port, host, () => resolve(server.address().port));
   });
 }
+
+/**
+ * Hand the URL to whatever the desktop uses.
+ *
+ * TWO WAYS THIS GOES WRONG, both found by reading it rather than running it:
+ *
+ * - `start` on Windows is a SHELL BUILTIN, not a program, so spawning it by name
+ *   fails every time. It has to be run through cmd, and the empty string is
+ *   cmd's title argument — without it, a quoted URL becomes the window title and
+ *   nothing opens.
+ * - spawn reports a missing program ASYNCHRONOUSLY. A try/catch around it catches
+ *   nothing, and an 'error' event with no listener is an uncaught exception —
+ *   which took the whole command down, AFTER the server had started, on any
+ *   machine without an opener. A listener that does nothing is the fix: the URL
+ *   is on screen either way, and a browser that will not open is not a reason to
+ *   stop serving.
+ */
+export function openInBrowser(url, { spawnImpl = spawn, platform = process.platform } = {}) {
+  const argv = platform === 'win32'
+    ? ['cmd', ['/c', 'start', '', url]]
+    : [platform === 'darwin' ? 'open' : 'xdg-open', [url]];
+  const child = spawnImpl(argv[0], argv[1], { stdio: 'ignore', detached: true });
+  child.on('error', () => {});
+  child.unref?.();
+  return child;
+}
+
+/**
+ * Is something already answering on this port, on either stack?
+ *
+ * A connect, not a bind: the question is "will the reader reach somebody else
+ * here", and a bind can succeed while the answer is yes.
+ */
+export async function occupied(port, { hosts = ['127.0.0.1', '::1'], timeout = 300 } = {}) {
+  const answers = await Promise.all(hosts.map((host) => reachable(host, port, timeout)));
+  return answers.some(Boolean);
+}
+
+function reachable(host, port, timeout) {
+  return new Promise((resolve) => {
+    const socket = connect({ host, port, timeout });
+    const done = (answer) => {
+      socket.destroy();
+      resolve(answer);
+    };
+    socket.once('connect', () => done(true));
+    socket.once('error', () => done(false));
+    socket.once('timeout', () => done(false));
+  });
+}

package/src/version.js

@@ -10,7 +10,7 @@
 export const NAME = 'Prolog Notebook';
 
 /** Must equal package.json's `version` — test/run.test.mjs enforces it. */
-export const VERSION = '0.5.0';
+export const VERSION = '0.5.1';
 
 /** The two facts a licence notice is actually made of. */
 export const YEAR = '2026';