toolaby 1.4.3 → 1.4.4

package/bin.mjs

@@ -32,9 +32,9 @@ import { homedir } from 'node:os';
 import { spawn } from 'node:child_process';
 import { createHmac, randomBytes } from 'node:crypto';
 import { wireManifest, WORKER_LINES } from './lib/manifest.js';
-import { detectProject, CODE_FILES, filesToWrite, STALE_FILES, BUILD_COPY_NOTE } from './lib/project.js';
+import { detectProject, CODE_FILES, filesToWrite, fillPages, scaffoldManifest, STALE_FILES, BUILD_COPY_NOTE } from './lib/project.js';
 
-const VERSION = '1.4.3';
+const VERSION = '1.4.4';
 const CLIENT_ID = 'toolaby-cli';
 const argv = process.argv.slice(2);
 // `--version` and `--help` are commands of their own; every other command is the first bare word.
@@ -218,7 +218,7 @@ async function wire() {
   // A command older than the Wall asks for files the Wall no longer hands out: said, with the way to the current one, rather than a crash.
   const missing = targets.map((p) => p.split('/').pop()).filter((name) => typeof plan.files[name] !== 'string');
   if (missing.length) fail(`This command (${VERSION}) is older than the Wall at ${wall}: it expects ${missing.join(', ')}, which the Wall no longer hands out.\n  Update it: npm install -g toolaby@latest — or run the Wall's own copy: npx --yes ${wall}/toolaby.tgz ${command} ${slug}`);
-  for (const path of targets) write(path, plan.files[path.split('/').pop()].replaceAll('__APP_POPUP__', appPopup ?? '').replaceAll('__APP_SIDE_PANEL__', appSidePanel ?? ''));
+  for (const path of targets) write(path, fillPages(plan.files[path.split('/').pop()], { appPopup, appSidePanel }));
   // What an earlier wiring wrote and this one does not, wherever it put them: taken away, so nothing stale is shipped.
   const removed = [];
   for (const at of new Set([project.codeDir, project.popupDir, 'public/', 'src/public/'])) for (const f of STALE_FILES) { const p = join(dir, `${at}${f}`); if (existsSync(p)) { unlinkSync(p); removed.push(`${at}${f}`); } }
@@ -256,12 +256,23 @@ async function create() {
   if (existsSync(dir)) fail(`${dir} already exists`);
   const plan = await filesFor(slug, true);
   const write = (rel, content) => { mkdirSync(dirname(join(dir, rel)), { recursive: true }); writeFileSync(join(dir, rel), content); };
-  for (const f of ['manifest.json', ...CODE_FILES, 'background.js', 'popup.html', 'popup.css', 'popup.js', 'README.md']) write(f, plan.files[f].replaceAll('__APP_POPUP__', '').replaceAll('__APP_SIDE_PANEL__', ''));
+  // The scaffold's own files as the Wall names them (older Walls did not, hence the list): a Wall that adds one to the
+  // minimal extension is written by this command too, instead of a manifest naming a file that never arrived.
+  const scaffold = Array.isArray(plan.scaffold) && plan.scaffold.length ? plan.scaffold : ['manifest.json', 'background.js', 'popup.html', 'sidepanel.html', 'popup.css', 'popup.js', 'README.md'];
+  const wanted = [...CODE_FILES, ...scaffold];
+  const absent = wanted.filter((f) => typeof plan.files[f] !== 'string');
+  if (absent.length) fail(`The Wall at ${wall} named ${absent.join(', ')} for a new extension but did not hand ${absent.length > 1 ? 'them' : 'it'} over.\n  Nothing was written. Update this command: npm install -g toolaby@latest — or run the Wall's own copy: npx --yes ${wall}/toolaby.tgz create ${slug}`);
+  // Both surfaces, and the panel drawn inside them: no page of the Wall's stands in front, so both names stay empty.
+  for (const f of wanted) write(f, fillPages(plan.files[f]));
+  // The manifest names the side panel only now that the page is beside it — an extension whose side_panel points at a
+  // missing file does not load at all, so a Wall that stops serving the page must not leave the key behind either.
+  const wroteSidePanel = wanted.includes('sidepanel.html');
+  write('manifest.json', JSON.stringify(scaffoldManifest(JSON.parse(readFileSync(join(dir, 'manifest.json'), 'utf8')), { sidePanel: wroteSidePanel }), null, 2) + '\n');
   for (const s of [16, 48, 128]) {
     const res = await fetch(`${wall}/boilerplate/icons/icon${s}.png`);
     write(join('icons', `icon${s}.png`), Buffer.from(await res.arrayBuffer()));
   }
-  out(`\n  ${plan.name} → ${dir}\n\n    1. chrome://extensions → Developer mode → Load unpacked → ${dir}\n    2. Click the icon: the popup shows what the Free plan holds; Buy opens ${plan.site}/tools/${slug}\n\n  Edit background.js: your work goes behind toolaby.gate().\n`);
+  out(`\n  ${plan.name} → ${dir}\n\n    1. chrome://extensions → Developer mode → Load unpacked → ${dir}\n    2. Click the icon: the popup shows what the Free plan holds; Buy opens ${plan.site}/tools/${slug}\n${wroteSidePanel ? "    3. Open side panel, in that popup: the same page at the panel's width (README.md says how to keep only one)\n" : ''}\n  Edit background.js: your work goes behind toolaby.gate().\n`);
 }
 
 // ── webhooks: the catalogue, and a delivery on demand ───────────────────────────────────────────────────────────────

package/lib/manifest.js

@@ -50,13 +50,22 @@ export function wireManifest(input, o) {
         did.push(`the Wall's popup in front of ${appPopup}: it opens on to yours while the device may, and shows the panel when it may not`);
     }
     // The extension's own side panel, the same way: the Wall's in front, with the permission a side panel needs.
+    // Chrome spells it side_panel.default_path, Firefox sidebar_action.default_panel; a manifest may carry both.
+    const theirs = (v) => (typeof v === 'string' && v !== WALL_SIDE_PANEL ? v : null);
     const declaredPanel = typeof manifest.side_panel?.default_path === 'string' ? manifest.side_panel.default_path : null;
-    const appSidePanel = declaredPanel && declaredPanel !== WALL_SIDE_PANEL ? declaredPanel : declaredPanel === WALL_SIDE_PANEL ? (o.rememberedSidePanel || null) : null;
-    if (appSidePanel && declaredPanel !== WALL_SIDE_PANEL) {
+    const declaredSidebar = typeof manifest.sidebar_action?.default_panel === 'string' ? manifest.sidebar_action.default_panel : null;
+    const ours = declaredPanel === WALL_SIDE_PANEL || declaredSidebar === WALL_SIDE_PANEL;
+    const appSidePanel = theirs(declaredPanel) ?? theirs(declaredSidebar) ?? (ours ? o.rememberedSidePanel || null : null);
+    if (theirs(declaredPanel)) {
         manifest.side_panel = { ...manifest.side_panel, default_path: WALL_SIDE_PANEL };
         if (!(Array.isArray(manifest.permissions) && manifest.permissions.includes('sidePanel')))
             manifest.permissions = add(manifest.permissions, 'sidePanel');
-        did.push(`the Wall's side panel in front of ${appSidePanel}: the same as the popup, at the panel's width`);
+        did.push(`the Wall's side panel in front of ${declaredPanel}: the same as the popup, at the panel's width`);
+    }
+    // Firefox's sidebar, when it names the same page — one that names another is left alone rather than pointed elsewhere.
+    if (theirs(declaredSidebar) && (!declaredPanel || declaredSidebar === declaredPanel)) {
+        manifest.sidebar_action = { ...manifest.sidebar_action, default_panel: WALL_SIDE_PANEL };
+        did.push(`the Wall's side panel in front of ${declaredSidebar} in Firefox's sidebar_action too`);
     }
     const named = typeof manifest.background?.service_worker === 'string' && manifest.background.service_worker.trim() ? manifest.background.service_worker.trim() : null;
     let writeWorker = null;

package/lib/project.js

@@ -19,6 +19,26 @@ export const filesToWrite = (p, appPopup, appSidePanel = null) => [
     ...(appSidePanel ? SIDE_PANEL_FILES.map((f) => `${p.popupDir}${f}`) : []),
     ...(p.extraFiles ?? []).map((f) => f.to),
 ];
+/**
+ * The scaffold's manifest, once it is known which pages were really written. Chrome refuses to load an extension
+ * whose `side_panel.default_path` names a file that is not there — the whole extension, not just the panel — so the
+ * minimal extension ships a manifest that names only its popup, and whatever writes the side panel adds it here.
+ */
+export function scaffoldManifest(manifest, wrote) {
+    if (!wrote.sidePanel)
+        return manifest;
+    const permissions = Array.isArray(manifest.permissions) ? [...manifest.permissions] : [];
+    if (!permissions.includes('sidePanel'))
+        permissions.push('sidePanel');
+    return { ...manifest, permissions, side_panel: { default_path: 'sidepanel.html' } };
+}
+/**
+ * The last two placeholders in a handed-out file — the extension's own popup and side panel, which only the
+ * writer knows, since it is the one that read the manifest. Everything else is filled where the files are built
+ * (wiring/files.ts). Every hand-out goes through this: the Wire button, the command, and the zip on the Set up
+ * page, which once shipped `appSidePanel: '__APP_SIDE_PANEL__'` because it filled the popup's name and not this one.
+ */
+export const fillPages = (text, pages = {}) => text.replaceAll('__APP_POPUP__', pages.appPopup ?? '').replaceAll('__APP_SIDE_PANEL__', pages.appSidePanel ?? '');
 /** The import of toolaby.js from a file at `from`, both relative to the root. */
 export function importPath(from, codeDir = '') {
     const depth = from.split('/').length - 1;
@@ -109,7 +129,8 @@ export function detectProject(o) {
         // A plain extension with a build (webpack, Rollup, Parcel, esbuild…) is wired the same way — the manifest is a file and
         // the files go beside it — but only what the build copies reaches the output, so that is said.
         const declared = typeof manifest?.action?.default_popup === 'string' ? manifest.action.default_popup : null;
-        const declaredPanel = typeof manifest?.side_panel?.default_path === 'string' ? manifest.side_panel.default_path : null;
+        // Chrome's side_panel, else Firefox's sidebar_action: the same page, two spellings.
+        const declaredPanel = typeof manifest?.side_panel?.default_path === 'string' ? manifest.side_panel.default_path : typeof manifest?.sidebar_action?.default_panel === 'string' ? manifest.sidebar_action.default_panel : null;
         const named = typeof manifest?.background?.service_worker === 'string' ? manifest.background.service_worker : null;
         const workerFile = named && has(named) ? named : 'background.js';
         return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "toolaby",
-  "version": "1.4.3",
+  "version": "1.4.4",
   "description": "The Toolaby command line: sign in once, then wire any Chrome extension to your tool on the Wall — sign-in, the Free plan, licences and subscriptions — or start a new one.",
   "type": "module",
   "bin": {