npm - prolog-notebook - Versions diffs - 0.6.1 → 0.6.2 - Mend

prolog-notebook 0.6.1 → 0.6.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,40 @@
 # Changelog
+## [0.6.2] — 2026-08-30
+From a field report: a built chapter opened in Chrome and Safari showed no controls and a Run
+button that did nothing, while the same directory worked in VS Code's browser.
+### Fixed
+- **A page that could not run looked exactly like one that could.** Opening `index.html` from
+  disk means `file://`, where browsers refuse ES modules, so none of the runtime loads. That
+  part is the browser doing its job; the page then lied about it twice.
+  The warning that exists for this sat **after the whole chapter** — line 540 of 551 — several
+  screens below the fold, which is the one place it could not do its job. It is now first in
+  the document and a fixed banner, revealed by a CSS `animation-delay` rather than a timer,
+  because script is precisely what is broken when it matters. `mount()` removes it long before
+  the delay elapses, so a page that boots never shows it and nothing jolts.
+  And **Run and Consult shipped enabled**, so the two controls a reader reaches for first were
+  full colour and inert — a screenshot of the failure was indistinguishable from success. They
+  now ship disabled and `mount()` enables them, which makes "this button works" and "something
+  is here to work it" one fact rather than two that can disagree. It also closes a real race on
+  a slow page.
+- **Every prediction box had the same id.** The ordinal is counted correctly and was dropped on
+  the last hop into `renderPredict`, which took its default every time. The test asserted the
+  shape of the id, which three identical ones satisfy; it now asserts uniqueness.
+- **The version picker had neither an id nor a name.** It only exists on a page that boots,
+  which is why the earlier console sweep never saw it. A served chapter's console is now empty.
+### Changed
+- `build` says that opening the directory from disk will not run, rather than mentioning HTTP
+  in passing. It is the point at which somebody is about to double-click the thing.
 ## [0.6.1] — 2026-08-30
 ### Fixed

package/bin/prolog-notebook.mjs CHANGED Viewed

@@ -416,7 +416,13 @@ async function page(command, args) {
       else copyFileSync(entry.copy, target);
     }
     process.stderr.write(`${out}: ${built.size} files\n`);
-    process.stderr.write(`Open ${join(out, 'index.html')} over HTTP, or host the directory.\n`);
+    // SAID HERE BECAUSE THIS IS WHERE IT IS ACTED ON. The obvious next move is to
+    // double-click index.html, and that is the one thing that cannot work:
+    // browsers refuse ES modules over file:// and the engine cannot be fetched
+    // there either (869erqq1u). The page says so too, but by then somebody is
+    // already looking at a chapter whose buttons do nothing.
+    process.stderr.write(`Host ${out} over HTTP — opening ${join(out, 'index.html')} from disk`
+      + ' will not run.\n');
     return 0;
   }

package/package.json CHANGED Viewed

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

package/src/build-info.json CHANGED Viewed

@@ -1,4 +1,4 @@
 {
-  "commit": "3abbaef",
-  "built": "2026-08-30 19:27:20 UTC"
+  "commit": "bdbce1b",
+  "built": "2026-08-30 22:41:37 UTC"
 }

package/src/build.js CHANGED Viewed

@@ -176,19 +176,26 @@ function page(notebook) {
 </head>
 <body>
 <main>
-${renderNotebook(notebook)}
 <!--
-  THE CHAPTER ABOVE IS ALREADY READABLE. Everything below is the runtime that
-  makes it runnable, and none of it is needed to read a word.
+  FIRST IN THE DOCUMENT, AND IT COSTS A READER NOTHING (869erqq1u). mount()
+  removes this element, and the stylesheet holds it invisible for a second and a
+  half before revealing it — so a page that boots never shows it, and a page that
+  cannot boot says so where somebody staring at a dead button will see it. It
+  used to sit AFTER the chapter, several screens below the fold, which is the one
+  place it could not do its job.
+  The delay is CSS rather than a timer, for the obvious reason: script is exactly
+  what is broken when this matters.
 -->
 <div id="boot-warning">
   <strong>This notebook is not running.</strong>
   The page loaded but its JavaScript did not. The usual cause is opening
-  <code>index.html</code> straight from disk — browsers block ES modules over
-  <code>file://</code>. Serve it over HTTP instead, or run
-  <code>prolog-notebook view</code> on the notebook itself.
-  The chapter is readable either way; only the buttons need this.
+  <code>index.html</code> straight from disk — browsers refuse ES modules over
+  <code>file://</code>, and the engine cannot be fetched there either. Serve this
+  directory over HTTP, or run <code>prolog-notebook view</code> on the notebook
+  itself. The chapter is readable either way; only the buttons need this.
 </div>
+${renderNotebook(notebook)}
 </main>
 <script type="module" src="app.js"></script>
 </body>

package/src/notebook.css CHANGED Viewed

@@ -502,13 +502,47 @@ button.primary:hover { background: #98380f; }
 }
 /* Shown until mount() runs; see notebook.js. Its presence means the page is inert. */
+/* THE PAGE THAT CANNOT RUN HAS TO SAY SO, WHERE IT WILL BE READ (869erqq1u).
+   Two properties, and both are the point:
+   FIXED, so it takes no layout. A working page carries this element for the
+   fraction of a second before mount() removes it, and a banner in the flow would
+   push the whole chapter down and then let it snap back — a visible jolt on every
+   single load, to warn about something that is not happening.
+   REVEALED ON A DELAY, in CSS. mount() removes it long before the animation
+   fires, so a page that boots never shows it at all; a page that cannot boot
+   shows it a second and a half in. It cannot be a timer, because script is the
+   thing that is broken. `forwards` holds the final frame rather than snapping
+   back to invisible. */
 #boot-warning {
-  margin: 0 0 2rem;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 100;
+  margin: 0;
   padding: 1rem 1.2rem;
-  border: 2px solid var(--err);
-  border-radius: 6px;
+  border-bottom: 2px solid var(--err);
   background: #fff5f3;
   font-size: .95rem;
+  opacity: 0;
+  animation: boot-warning .25s ease 1.5s forwards;
+}
+@keyframes boot-warning { to { opacity: 1; } }
+/* ROOM FOR IT, made on the same delay and only while it is there. A fixed banner
+   would otherwise sit over the chapter's title — the page is broken, but it
+   should not also look broken. `:has` is what keeps this honest: the moment
+   mount() removes the element the selector stops matching, so a page that boots
+   never reserves the space, and a browser too old for `:has` merely goes back to
+   the banner overlapping. */
+body:has(#boot-warning) { animation: boot-warning-room .25s ease 1.5s forwards; }
+@keyframes boot-warning-room { to { padding-top: 7rem; } }
+/* Somebody who has asked not to be moved still gets the message — only the fade
+   goes. Without this the whole rule is skipped and the warning never appears. */
+@media (prefers-reduced-motion: reduce) {
+  #boot-warning { animation-duration: 0s; }
 }
 #boot-warning strong { color: var(--err); }
 #boot-warning pre {

package/src/notebook.js CHANGED Viewed

@@ -595,7 +595,12 @@ export function offerDownload(root, options = {}) {
   // their version IS the chapter, and a menu with one item is a control
   // pretending to offer something.
   unit.innerHTML = '<span class="state notebook-state"><span class="only"></span>'
-    + '<span class="picker" hidden><select aria-label="which version to download">'
+    // `name` rather than `id`, because a page may hold more than one notebook
+    // (v0.4) and two ids would collide where two names cannot — this select is in
+    // no form. Without either, the issues panel flags it, which is the same red
+    // console 869ernmxe was about; it only shows up on a page that BOOTS, so the
+    // earlier sweep never saw it.
+    + '<span class="picker" hidden><select name="notebook-version" aria-label="which version to download">'
     + '<option value="mine">Your version</option>'
     + '<option value="published">As published</option>'
     + `</select>${icon('chevron')}</span></span>`
@@ -677,6 +682,10 @@ function mountProgram(cell, options, bus) {
   const button = cell.querySelector('[data-act="consult"]') ?? cell.querySelector('button');
   const resetBtn = cell.querySelector('[data-act="reset"]');
   const status = cell.querySelector('.status');
+  // THE BUTTON IS LIVE BECAUSE THIS RAN, and not a moment before (869erqq1u).
+  // It ships disabled so that a page whose runtime never arrived looks like what
+  // it is, rather than offering a control nothing is listening to.
+  button.disabled = false;
   /**
    * The one cell whose state a re-consult does not undo (format §8).
@@ -1482,6 +1491,10 @@ function mountQuery(cell, options, bus, { above = [], below = [], prediction = n
   }
   decorateSaved();
+  // Same as a program cell's Consult: enabled here, by the thing that makes it
+  // do something, so the page cannot show a live-looking Run with no runtime
+  // behind it (869erqq1u).
+  runBtn.disabled = false;
   refresh();
   return {

package/src/render.js CHANGED Viewed

@@ -100,7 +100,7 @@ export function renderContainer(cell, ordinal = 1) {
       return `<div class="aside">\n${renderProse(joinHeadAndBody(cell))}\n</div>`;
     case 'predict':
-      return renderPredict(cell);
+      return renderPredict(cell, ordinal);
     case 'bullets':
       return `<div class="bullets">\n${cell.title ? `<h2>${renderInline(cell.title)}</h2>\n` : ''}${renderProse(cell.body)}\n</div>`;
@@ -164,6 +164,24 @@ function splitReveal(body) {
   };
 }
+/**
+ * EVERY BUTTON SHIPS DISABLED, AND THE RUNTIME TURNS IT ON (869erqq1u).
+ *
+ * A page whose JavaScript never arrives is a page where none of these can work —
+ * opened from disk, where browsers refuse ES modules; behind a CSP that blocks
+ * the script; on a connection that dropped it. What that page must not do is look
+ * exactly like a working one. Consult and Run used to ship enabled, so the two
+ * controls a reader reaches for first were full colour and did nothing, and a
+ * screenshot of the failure was indistinguishable from success.
+ *
+ * mount() enables them, which makes "this button works" and "something is here to
+ * work it" the same fact rather than two that can disagree. It also closes a real
+ * race on a slow page: they were clickable before anything was wired to them.
+ *
+ * `; next`, `all` and `stop` were already disabled for the ordinary reason — there
+ * is no query open yet — and now the whole bar tells one story.
+ */
 /**
  * A program cell: the Prolog, and a button that loads it.
  *
@@ -180,7 +198,7 @@ export function renderProgram(cell) {
   return `<div class="cell program" data-cell="${escapeHtml(cell.id)}">
   <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>
+    <button class="primary" data-act="consult" disabled>Consult</button></div>
   <textarea id="src-${escapeHtml(cell.id)}" spellcheck="false">${escapeHtml(cell.source)}</textarea>
 </div>`;
 }
@@ -217,7 +235,7 @@ export function renderQuery(cell, options = {}) {
   return `<div class="cell query" data-cell="${escapeHtml(cell.id)}"${hold}${auto}${wasStale}>
   <div class="bar">query<span class="spacer"></span><span class="status"></span>
     <button data-act="reset" disabled>reset</button>
-    <button class="primary" data-act="run">Run</button>
+    <button class="primary" data-act="run" disabled>Run</button>
     <button data-act="next" disabled>; next</button>
     <button data-act="all" disabled>all</button>
     <button data-act="stop" disabled>stop</button></div>

package/src/version.js CHANGED Viewed

@@ -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.6.1';
+export const VERSION = '0.6.2';
 /** The two facts a licence notice is actually made of. */
 export const YEAR = '2026';