pennyrouter 0.3.41 → 0.3.43

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pennyrouter",
-  "version": "0.3.41",
+  "version": "0.3.43",
   "description": "Install and manage PennyRouter local coding-agent integrations.",
   "homepage": "https://pennyrouter.com",
   "bugs": {
@@ -29,6 +29,7 @@
   },
   "dependencies": {
     "@xterm/addon-fit": "^0.10.0",
+    "@xterm/addon-unicode11": "^0.8.0",
     "@xterm/xterm": "^5.5.0",
     "node-pty": "^1.0.0",
     "ws": "^8.18.0"

package/src/launch.js

@@ -315,7 +315,7 @@ export async function installPennyCompare() {
   await mkdir(join(destination, "reports"), { recursive: true, mode: 0o700 });
   await mkdir(pennyBinDir(), { recursive: true, mode: 0o755 });
   const modules = join(destination, "web-demo", "node_modules");
-  for (const name of ["@xterm/addon-fit", "@xterm/xterm", "node-pty", "ws"]) {
+  for (const name of ["@xterm/addon-fit", "@xterm/addon-unicode11", "@xterm/xterm", "node-pty", "ws"]) {
     const target = join(modules, name);
     await mkdir(dirname(target), { recursive: true });
     await cp(await findInstalledPackage(name), target, { recursive: true });

package/src/launch.test.js

@@ -106,6 +106,10 @@ async function main() {
     assert.equal(second.changed, false);
     assert.equal(await fileMode(pennyShimPath()), 0o755);
     assert.ok(fs.existsSync(path.join(pennyRuntimeDir(), "bin", "penny.js")));
+    for (const asset of ["terminal-unicode.js", "artifacts.mjs", "artifact-preview.html",
+      "node_modules/@xterm/addon-unicode11/lib/addon-unicode11.js"]) {
+      assert.ok(fs.existsSync(path.join(pennyCompareDir(), "web-demo", asset)), `compare installs ${asset}`);
+    }
     assert.equal(
       fs.realpathSync(path.join(pennyBinDir(), "penny-compare")),
       fs.realpathSync(path.join(pennyCompareDir(), "penny-compare")),

package/standalone/web-demo/artifact-preview.html

@@ -0,0 +1,92 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <meta name="referrer" content="no-referrer">
+  <title>Demo artifact preview · Penny Compare</title>
+  <style>
+    :root { color-scheme: dark; font: 14px/1.4 system-ui, sans-serif; }
+    * { box-sizing: border-box; }
+    html, body { margin: 0; height: 100%; background: #111116; color: #e3e3e8; }
+    body { display: flex; flex-direction: column; }
+    header { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 12px 16px;
+      background: #24242b; border-bottom: 1px solid #44444d; }
+    strong { color: #9ded83; }
+    #filename { overflow-wrap: anywhere; flex: 1; }
+    button { font: inherit; color: inherit; background: transparent; border: 1px solid #74747c;
+      padding: 5px 12px; cursor: pointer; }
+    button:disabled { opacity: .45; cursor: default; }
+    #status { margin: 0; padding: 8px 16px; color: #b8b8c3; }
+    #status:empty { display: none; }
+    iframe { flex: 1; width: 100%; min-height: 0; border: 0; background: white; }
+  </style>
+</head>
+<body>
+  <header><strong id="side">PENNY COMPARE</strong><span id="filename">Artifact preview</span>
+    <button id="refresh" disabled>Refresh</button><button id="download" disabled>Download</button></header>
+  <p id="status" role="status">Connecting to your demo…</p>
+  <iframe id="preview" title="Generated HTML preview" sandbox="allow-scripts" referrerpolicy="no-referrer"></iframe>
+  <script>
+    let session;
+    let content;
+    let loading = false;
+    const status = document.getElementById('status');
+    const refresh = document.getElementById('refresh');
+    const download = document.getElementById('download');
+    async function load() {
+      if (!session || loading) return;
+      loading = true;
+      refresh.disabled = true;
+      status.textContent = 'Loading…';
+      try {
+        const params = new URLSearchParams({ side: session.side, path: session.path });
+        const response = await fetch(`/artifact?${params}`, {
+          headers: { Authorization: `Bearer ${session.token}` }, cache: 'no-store',
+          signal: AbortSignal.timeout(15000),
+        });
+        if (!response.ok) throw new Error('File is unavailable. It may have been moved or this demo session has ended.');
+        const artifact = await response.json();
+        content = artifact.content;
+        // This policy precedes generated markup and cannot be relaxed by its own meta tags.
+        // HTTPS resources support chart libraries; network API calls and nested frames stay disabled.
+        const policy = "default-src https: data: blob: 'unsafe-inline' 'unsafe-eval'; connect-src 'none'; frame-src 'none'; object-src 'none'; base-uri 'none'; form-action 'none'";
+        document.getElementById('preview').srcdoc =
+          `<meta http-equiv="Content-Security-Policy" content="${policy}">` + content;
+        download.disabled = false;
+        status.textContent = '';
+      } catch (error) {
+        status.textContent = error instanceof TypeError || error.name === 'TimeoutError'
+          ? 'Could not reach your demo. The session may have ended. You can still download the loaded file.'
+          : error.message || 'This demo session has ended.';
+      } finally { loading = false; refresh.disabled = false; }
+    }
+    refresh.onclick = load;
+    download.onclick = () => {
+      if (content === undefined) return;
+      const url = URL.createObjectURL(new Blob([content], { type: 'text/html;charset=utf-8' }));
+      const link = document.createElement('a');
+      link.href = url; link.download = session.path.split('/').pop(); link.click();
+      setTimeout(() => URL.revokeObjectURL(url), 10000);
+    };
+    window.addEventListener('message', (event) => {
+      if (session || event.origin !== location.origin || event.source !== window.opener ||
+          event.data?.type !== 'compare-artifact-session' || !['left', 'right'].includes(event.data.side) ||
+          typeof event.data.path !== 'string' || typeof event.data.token !== 'string') return;
+      session = event.data;
+      clearInterval(handshake);
+      document.getElementById('side').textContent = session.side === 'left' ? 'NATIVE' : 'PENNY';
+      document.getElementById('filename').textContent = session.path;
+      document.title = `${session.path.split('/').pop()} · ${session.side === 'left' ? 'Native' : 'Penny'}`;
+      load();
+    });
+    const requestSession = () => window.opener?.postMessage({ type: 'compare-artifact-ready' }, location.origin);
+    const handshake = setInterval(requestSession, 500);
+    requestSession();
+    setTimeout(() => {
+      clearInterval(handshake);
+      if (!session) status.textContent = 'Open this preview from the Files list in an active demo.';
+    }, 10000);
+  </script>
+</body>
+</html>

package/standalone/web-demo/artifacts.mjs

@@ -0,0 +1,67 @@
+import { constants } from 'node:fs';
+import { lstat, open, readdir, realpath } from 'node:fs/promises';
+import { extname, join, relative, resolve, sep } from 'node:path';
+
+export const maxArtifactBytes = 5 * 1024 * 1024;
+const excluded = new Set(['node_modules', 'vendor']);
+// Keep the type mapping separate so additional preview formats can be added here.
+export const artifactType = (path) => ['.html', '.htm'].includes(extname(path).toLowerCase()) ? 'html' : null;
+const inside = (root, path) => path.startsWith(root + sep);
+
+export async function listArtifacts(root) {
+  const files = [];
+  let inspected = 0;
+  async function walk(directory, depth) {
+    if (depth > 8 || files.length >= 200 || inspected >= 5000) return;
+    const entries = await readdir(directory, { withFileTypes: true }).catch(() => []);
+    for (const entry of entries) {
+      if (++inspected > 5000 || files.length >= 200) break;
+      if (entry.name.startsWith('.') || excluded.has(entry.name) || entry.isSymbolicLink()) continue;
+      const path = join(directory, entry.name);
+      if (entry.isDirectory()) await walk(path, depth + 1);
+      else if (entry.isFile() && artifactType(path)) {
+        const stat = await lstat(path).catch(() => null);
+        if (stat?.isFile() && stat.size <= maxArtifactBytes) {
+          files.push({ path: relative(root, path).split(sep).join('/'), type: artifactType(path),
+            size: stat.size, modifiedAt: stat.mtimeMs });
+        }
+      }
+    }
+  }
+  await walk(root, 0);
+  return files.sort((a, b) => a.path.localeCompare(b.path));
+}
+
+export async function readArtifact(root, path) {
+  if (typeof path !== 'string' || !path || path.includes('\\') || path.includes('\0') ||
+      path.split('/').some((part) => !part || part === '..' || part.startsWith('.') || excluded.has(part)) ||
+      !artifactType(path)) throw new Error('Invalid artifact path');
+  const canonicalRoot = await realpath(root);
+  const target = resolve(canonicalRoot, path);
+  if (!inside(canonicalRoot, target)) throw new Error('Invalid artifact path');
+  let current = canonicalRoot;
+  for (const part of path.split('/')) {
+    current = join(current, part);
+    if ((await lstat(current)).isSymbolicLink()) throw new Error('Invalid artifact path');
+  }
+  const canonicalTarget = await realpath(target);
+  if (!inside(canonicalRoot, canonicalTarget)) throw new Error('Invalid artifact path');
+  const handle = await open(canonicalTarget, constants.O_RDONLY | constants.O_NOFOLLOW | constants.O_NONBLOCK);
+  try {
+    // On Linux, verify the opened file too, in case a directory was swapped during traversal.
+    if (process.platform === 'linux' && !inside(canonicalRoot, await realpath(`/proc/self/fd/${handle.fd}`))) {
+      throw new Error('Invalid artifact path');
+    }
+    const stat = await handle.stat();
+    if (!stat.isFile() || stat.size > maxArtifactBytes) throw new Error('Artifact is too large or unavailable');
+    const buffer = Buffer.alloc(maxArtifactBytes + 1);
+    let length = 0;
+    while (length < buffer.length) {
+      const { bytesRead } = await handle.read(buffer, length, buffer.length - length, null);
+      if (!bytesRead) break;
+      length += bytesRead;
+    }
+    if (length > maxArtifactBytes) throw new Error('Artifact is too large');
+    return buffer.subarray(0, length).toString('utf8');
+  } finally { await handle.close(); }
+}

package/standalone/web-demo/terminal-unicode.js

@@ -0,0 +1,14 @@
+// Keep the terminal's widths aligned with Claude's status-line cursor movements.
+// Unicode 11 predates the coin emoji (Unicode 13), which Claude counts as two cells.
+globalThis.configureCompareUnicode = function (terminal, Unicode11Addon) {
+  const addon = new Unicode11Addon();
+  addon.activate({ unicode: { register(base) {
+    const provider = Object.create(base);
+    provider.version = '11-penny';
+    provider.wcwidth = function (codepoint) {
+      return codepoint === 0x1fa99 ? 2 : base.wcwidth(codepoint);
+    };
+    terminal.unicode.register(provider);
+  } } });
+  terminal.unicode.activeVersion = '11-penny';
+};