@webship.co/workspace 1.0.0 → 1.0.1

package/core/workspace-app/PLUGINS.md

@@ -205,7 +205,7 @@ it alike), so a lazy menu behaves like an inline one once open. A string return
 menu, inline. A plugin that must also run on a dashboard older than this form checks
 `api.capabilities && api.capabilities.has('row-menu-body')` and falls back to the string.
 
-The core's own menus take the same road: DDEV, COMPOSER, Tests and SCREENS are drawn as this shell and
+The core's own menus take the same road: DDEV, COMPOSER, Tests, SCREENS, NODE and More are drawn as this shell and
 answer at `/fragments/row-menu/<slot>/<ws>/<project>` with no `body` parameter, their items computed for
 that one project when the menu opens (a page of fifty rows is a third of what it was). A plugin's
 `body` must still name one of its own fragments; the core slots are not open to one.

package/core/workspace-app/package.json

@@ -1,6 +1,6 @@
 {
   "name": "workspace-dashboard",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "The Webship Workspace dashboard: a lean core (workspaces, builders, settings, the assistant shell, the plugin system) that every feature joins as a @webship.co/workspace-<name> plugin — required with npm, then activated, installed and configured.",
   "license": "ISC",
   "main": "server.js",

package/core/workspace-app/plugin-loader.js

@@ -414,7 +414,7 @@ function rowMenuHtml(slot, result, ctx = {}) {
 
 /**
  * The shell of a row menu whose body loads when it opens — the one markup for a plugin's lazy menu and for
- * the core's own (DDEV, COMPOSER, Tests, SCREENS): `<span class="act-with-status">` around the
+ * the core's own (DDEV, COMPOSER, Tests, SCREENS, NODE, More): `<span class="act-with-status">` around the
  * `.uk-inline.act-menu.act-menu-<slot>` wrapper, the button (`html`), an empty `uk-dropdown` shell and the
  * caption. The shell fetches `/fragments/row-menu/<slot>/<ws>/<project><query>` on `menu-opened` (the relay
  * of UIkit's `beforeshow` in public/ui.js) and swaps the answer in as its inner HTML; `triggers` adds more

package/core/workspace-app/server.js

@@ -1018,13 +1018,36 @@ function composerMenuBody(key, p, projectPath, isDdev, mode = 'manifest') {
  * left, a package and the package.json scripts on the right. What runs lives in actions/node.js.
  */
 function nodeMenuHtml(key, p, projectPath, isDdev) {
-  const { MANAGERS, NODE_GROUPS, NODE_RUN_ACTIONS, NODE_PACKAGE_ACTIONS, NODE_SCRIPT_ROUTE,
-    hasPackageJson, nodeInfo, nodeArgsFor, nodeScripts } = require('./actions/node');
-  if (!hasPackageJson(projectPath)) return '';
+  const state = nodeMenuState(projectPath);
+  if (!state) return '';
+  // The row carries the button and the caption; the body (nodeMenuBody) arrives from
+  // /fragments/row-menu/node/<ws>/<project> when the menu opens — fifty rows, fifty buttons, no menu (#111).
+  return menuShellHtml('node', {
+    key, project: p, caption: state.caption, dropdownClasses: 'node-dropdown',
+    html: '<button class="uk-button uk-button-default uk-button-small" type="button" title="npm and yarn for this folder"><span uk-icon="icon: nut; ratio: .7"></span> NODE <span uk-icon="icon: chevron-down; ratio: .6"></span></button>',
+  });
+}
+
+/** What the NODE caption says: package.json parsed (or not), and which lock files sit beside it. Null without a package.json. */
+function nodeMenuState(projectPath) {
+  const { hasPackageJson, nodeInfo } = require('./actions/node');
+  if (!hasPackageJson(projectPath)) return null;
   const info = nodeInfo(projectPath);
-  const lockFile = { yarn: 'yarn.lock', npm: 'package-lock.json' };
   const caption = !info.valid ? 'bad json'
     : (info.locks.yarn && info.locks.npm ? '2 locks' : (info.locks.yarn ? 'yarn.lock' : (info.locks.npm ? 'npm lock' : 'no lock')));
+  return { info, caption };
+}
+
+/**
+ * The NODE menu's body — what used to sit inside the dropdown on every row — for one project, served by
+ * /fragments/row-menu/node/<ws>/<project> when the menu opens. '' for a folder without package.json.
+ */
+function nodeMenuBody(key, p, projectPath, isDdev) {
+  const { MANAGERS, NODE_GROUPS, NODE_RUN_ACTIONS, NODE_PACKAGE_ACTIONS, NODE_SCRIPT_ROUTE, nodeArgsFor, nodeScripts } = require('./actions/node');
+  const state = nodeMenuState(projectPath);
+  if (!state) return '';
+  const { info } = state;
+  const lockFile = { yarn: 'yarn.lock', npm: 'package-lock.json' };
   const vals = (m, extra = '') => `hx-vals='{"workspace":"${esc(key)}","projectName":"${esc(p)}","manager":"${m}"${extra}}' hx-target="#webship-workspace-output" hx-swap="innerHTML"`;
   const scripts = info.valid ? nodeScripts(info.pkg) : [];
   const panel = (m) => {
@@ -1063,17 +1086,12 @@ function nodeMenuHtml(key, p, projectPath, isDdev) {
     </div></li>`;
   };
   const tabs = MANAGERS.map((m) => `<li><a href="#">${m} <span class="uk-text-meta">· ${info.locks[m] ? 'lock ✓' : 'no lock'}</span></a></li>`).join('');
-  return `<span class="act-with-status"><div class="uk-inline act-menu act-menu-node">
-    <button class="uk-button uk-button-default uk-button-small" type="button" title="npm and yarn for this folder"><span uk-icon="icon: nut; ratio: .7"></span> NODE <span uk-icon="icon: chevron-down; ratio: .6"></span></button>
-    <div uk-dropdown="mode: click; pos: bottom-right" class="node-dropdown">
-      <ul class="uk-nav uk-dropdown-nav">
+  return `<ul class="uk-nav uk-dropdown-nav">
         <li class="uk-nav-header">Node · ${esc((info.pkg && typeof info.pkg.name === 'string' && info.pkg.name) || p)}</li>
         <li data-entry="how it runs"><span class="uk-text-meta">${isDdev ? 'Runs as ddev npm / ddev yarn in this project.' : "Not a DDEV project — runs in the dashboard's DDEV container."}${info.pinned ? ` packageManager: ${esc(info.pinned.spec)}.` : ''}${info.nodeModules ? ' node_modules is here.' : ' No node_modules yet.'}${info.valid ? '' : ' package.json is not valid JSON.'}</span></li>
       </ul>
       <ul class="uk-tab node-tabs" data-keep-open uk-tab="active: ${Math.max(0, MANAGERS.indexOf(info.preferred))}">${tabs}</ul>
-      <ul class="uk-switcher">${MANAGERS.map(panel).join('')}</ul>
-    </div>
-  </div><span class="act-status uk-text-meta">${esc(caption)}</span></span>`;
+      <ul class="uk-switcher">${MANAGERS.map(panel).join('')}</ul>`;
 }
 
 
@@ -3285,6 +3303,46 @@ function ddevMenuItemsHtml({ key, p, meta, projectPath, gates, ddev }) {
  * workspace's type must WANT the action (policy — `type:` in its settings file). Read once per page by
  * the rows, and once per request by a menu body served on its own.
  */
+/**
+ * The More menu's items for one project — the changelog, the recordings, the backups and the remove —
+ * before the Buttons settings arrange them. The row builds them to count what the caption says
+ * ("3 actions") and /fragments/row-menu/more/<ws>/<project> builds them again when the menu opens (#111).
+ * Both verbs of the teardown also live in the DDEV menu, where a DDEV project's teardown belongs. They
+ * stay here too: More is where someone looks for them, and a folder DDEV does not manage has no other home.
+ */
+function moreMenuItemsHtml({ key, p, gates }) {
+  const { canBackup, canRemove } = gates;
+  const items = [];
+  // What this product shipped, read from the CHANGELOG it already keeps. It belongs to the
+  // row rather than to the rail: a changelog is a fact about one product, and the question
+  // people ask is "what went into 1.0.3 of THIS", standing in front of it in its folder.
+  // The latest version is in the label, so the menu answers the common case unopened.
+  const cl = changelog.changelogFor(key, p);
+  if (cl) {
+    const latest = (changelog.changelogIndex().find((r) => r.workspace === key && r.item === p) || {}).latest || '';
+    items.push(`<li><a href hx-get="/fragments/changelog/${encodeURIComponent(key)}/${encodeURIComponent(p)}"
+      hx-target="#editor-modal-body" hx-swap="innerHTML" uk-toggle="target: #editor-modal"
+      title="Releases, newest first, from ${esc(cl.file)}"><span uk-icon="icon: history; ratio: .7"></span> Changelog${latest ? ` <span class="uk-text-meta">${esc(latest)}</span>` : ''}</a></li>`);
+  }
+  // Recordings about this project: a video, or audio, started from a set of pre-prompts.
+  if (projectMake.WORKSPACES.includes(key)) {
+    const makeLink = (kind, icon, label, hint) => `<li data-entry="${esc(label.toLowerCase())}"><a href hx-get="/fragments/projects/make-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}?kind=${kind}"
+      hx-target="#editor-modal-body" hx-swap="innerHTML" hx-on::after:request="UIkit.modal('#editor-modal').show()"
+      title="${esc(hint)}"><span uk-icon="icon: ${icon}; ratio: .7"></span> ${esc(label)}…</a></li>`;
+    items.push(makeLink('video', 'play-circle', 'Create a video', 'A narrated video about this project, from a set of pre-prompts'));
+    items.push(makeLink('audio', 'microphone', 'Create audio', 'A spoken recording about this project, from a set of pre-prompts'));
+    items.push('<li class="uk-nav-divider"></li>');
+  }
+  if (canBackup) items.push(`<li><a href="${wsUrl(key, '/backups')}"><span uk-icon="icon: album; ratio: .7"></span> Backups for this workspace</a></li>`);
+  if (canRemove) {
+    items.push('<li class="uk-nav-divider"></li>');
+    items.push(`<li><a href class="uk-text-danger" hx-get="/fragments/projects/remove-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}" hx-target="#editor-modal-body" hx-swap="innerHTML"
+      hx-on::after:request="UIkit.modal('#editor-modal').show()"
+      title="Asks about a backup, then confirms, then removes"><span uk-icon="icon: trash; ratio: .7"></span> Remove the project…</a></li>`);
+  }
+  return items.join('');
+}
+
 function rowGates(dir, meta) {
   const allowed = meta.typeActions;
   return {
@@ -3462,7 +3520,8 @@ async function screensMenuBody(ws, project) {
 
 // The row menus the core draws itself whose bodies load when they open — the slots
 // /fragments/row-menu/<slot>/<ws>/<project> answers with no `body` parameter (coreRowMenuBody).
-const CORE_ROW_MENUS = new Set(['ddev', 'composer', 'tests', 'screens']);
+// NODE and More joined in #111: a row carries their buttons and captions, not their dropdowns.
+const CORE_ROW_MENUS = new Set(['ddev', 'composer', 'tests', 'screens', 'node', 'more']);
 
 /**
  * The body of one of the core's row menus for one project, as `{ status, html }`: the dropdown's inner
@@ -3498,19 +3557,27 @@ async function coreRowMenuBody(slot, key, project) {
     const { nav, oob } = await screensMenuBody(key, project);
     return { status: 200, html: `<ul class="uk-nav uk-dropdown-nav">${nav}</ul>${oob}` };
   }
+  if (slot === 'node') {
+    const body = nodeMenuBody(key, project, projectPath, isDdev);
+    return body ? { status: 200, html: body } : none('No package.json here.');
+  }
+  if (slot === 'more') {
+    const items = moreMenuItemsHtml({ key, p: project, gates });
+    return items ? { status: 200, html: `<ul class="uk-nav uk-dropdown-nav">${items}</ul>` } : none('Nothing more to offer here.');
+  }
   return none('No such menu.');
 }
 
 /**
  * The Buttons settings page lists what each menu has been seen to hold (row-layout's seen record). A
  * menu whose body loads when it opens (coreRowMenuBody) is recorded when one opens, so on a dashboard
- * where nobody has opened COMPOSER or Tests yet the page would list nothing for them: before it is drawn,
+ * where nobody has opened COMPOSER, Tests or NODE yet the page would list nothing for them: before it is drawn,
  * each such menu with nothing on record is built once, for the first project that carries it, and
  * arranged — which is what records it. DDEV is counted on every row, so it is on record already, and
  * SCREENS lists whatever sessions happen to run, which is nothing to learn from.
  */
 async function learnCoreMenus() {
-  for (const slot of ['composer', 'tests']) {
+  for (const slot of ['composer', 'tests', 'node']) {
     if (Object.keys(rowLayout.seenMenu(slot).groups).length) continue;
     let learned = false;
     for (const [key, meta] of Object.entries(loadWorkspaces())) {
@@ -3727,47 +3794,17 @@ async function projectRowsHtml(key, dir, state) {
             </div><span class="act-status uk-text-meta">${!rag.up ? 'offline' : built ? 'indexed' : 'none'}</span></span>`;
           })() : '';
     const moreMenu = (() => {
-            // Both verbs also live in the DDEV menu, where a DDEV project's
-            // teardown belongs. They stay here too: More is where someone looks
-            // for them, and a folder DDEV does not manage has no other home.
-            const items = [];
-            // What this product shipped, read from the CHANGELOG it already keeps. It belongs to the
-            // row rather than to the rail: a changelog is a fact about one product, and the question
-            // people ask is "what went into 1.0.3 of THIS", standing in front of it in its folder.
-            // The latest version is in the label, so the menu answers the common case unopened.
-            const cl = changelog.changelogFor(key, p);
-            if (cl) {
-              const latest = (changelog.changelogIndex().find((r) => r.workspace === key && r.item === p) || {}).latest || '';
-              items.push(`<li><a href hx-get="/fragments/changelog/${encodeURIComponent(key)}/${encodeURIComponent(p)}"
-                hx-target="#editor-modal-body" hx-swap="innerHTML" uk-toggle="target: #editor-modal"
-                title="Releases, newest first, from ${esc(cl.file)}"><span uk-icon="icon: history; ratio: .7"></span> Changelog${latest ? ` <span class="uk-text-meta">${esc(latest)}</span>` : ''}</a></li>`);
-            }
-            // Recordings about this project: a video, or audio, started from a set of pre-prompts.
-            if (projectMake.WORKSPACES.includes(key)) {
-              const makeLink = (kind, icon, label, hint) => `<li data-entry="${esc(label.toLowerCase())}"><a href hx-get="/fragments/projects/make-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}?kind=${kind}"
-                hx-target="#editor-modal-body" hx-swap="innerHTML" hx-on::after:request="UIkit.modal('#editor-modal').show()"
-                title="${esc(hint)}"><span uk-icon="icon: ${icon}; ratio: .7"></span> ${esc(label)}…</a></li>`;
-              items.push(makeLink('video', 'play-circle', 'Create a video', 'A narrated video about this project, from a set of pre-prompts'));
-              items.push(makeLink('audio', 'microphone', 'Create audio', 'A spoken recording about this project, from a set of pre-prompts'));
-              items.push('<li class="uk-nav-divider"></li>');
-            }
-            if (canBackup) items.push(`<li><a href="${wsUrl(key, '/backups')}"><span uk-icon="icon: album; ratio: .7"></span> Backups for this workspace</a></li>`);
-            if (canRemove) {
-              items.push('<li class="uk-nav-divider"></li>');
-              items.push(`<li><a href class="uk-text-danger" hx-get="/fragments/projects/remove-form/${encodeURIComponent(key)}/${encodeURIComponent(p)}" hx-target="#editor-modal-body" hx-swap="innerHTML"
-                hx-on::after:request="UIkit.modal('#editor-modal').show()"
-                title="Asks about a backup, then confirms, then removes"><span uk-icon="icon: trash; ratio: .7"></span> Remove the project…</a></li>`);
-            }
             // Arranged before it is counted, like DDEV — and whether there is a More at all is decided after,
-            // since hiding can empty it and a custom action can fill it.
-            const arranged = rowLayout.arrangeNavInner('more', items.join(''), rowCtx);
+            // since hiding can empty it and a custom action can fill it. The row carries the button and the
+            // count; the items arrive from /fragments/row-menu/more/<ws>/<project> when the menu opens.
+            const arranged = rowLayout.arrangeNavInner('more', moreMenuItemsHtml({ key, p, gates }), rowCtx);
             if (!/<li\b/.test(arranged)) return '';
             // Dividers are not actions — count only what can be clicked.
             const n = (arranged.match(/<a /g) || []).length;
-            return `<span class="act-with-status"><div class="uk-inline act-menu act-menu-more">
-              <button class="uk-button uk-button-default uk-button-small" type="button" title="More actions"><span uk-icon="icon: more; ratio: .7"></span> More <span uk-icon="icon: chevron-down; ratio: .6"></span></button>
-              <div uk-dropdown="mode: click; pos: bottom-right"><ul class="uk-nav uk-dropdown-nav">${arranged}</ul></div>
-            </div><span class="act-status uk-text-meta">${n} action${n === 1 ? '' : 's'}</span></span>`;
+            return menuShellHtml('more', {
+              key, project: p, caption: `${n} action${n === 1 ? '' : 's'}`,
+              html: '<button class="uk-button uk-button-default uk-button-small" type="button" title="More actions"><span uk-icon="icon: more; ratio: .7"></span> More <span uk-icon="icon: chevron-down; ratio: .6"></span></button>',
+            });
           })();
     // SCREENS is drawn beside the running state in the card's head, so the tool strip leaves it out.
     const screensOnTools = '';
@@ -5783,7 +5820,7 @@ const server = http.createServer(async (req, res) => {
       // The body of a plugin's row menu that loads when it opens (plugin-loader's rowMenuHtml): the
       // plugin's own fragment, arranged like an inline menu's items — the Buttons settings hide, order
       // and add to it the same way, and the settings page sees its entries once one has been opened.
-      // The core's own menus (DDEV, COMPOSER, Tests, SCREENS) take the same route with no `body`: their
+      // The core's own menus (DDEV, COMPOSER, Tests, SCREENS, NODE, More) take the same route with no `body`: their
       // bodies come from coreRowMenuBody, computed for this one project when the menu opens.
       if (pathname.startsWith('/fragments/row-menu/')) {
         const m = pathname.match(/^\/fragments\/row-menu\/([a-z0-9-]+)\/([a-z0-9_-]+)\/([a-zA-Z0-9_-]+)$/);

package/core/workspace-app/tests/unit/images-svg.test.js

@@ -168,10 +168,16 @@ test('a drawing that lost shapes to the sanitiser is drawn again; one that never
   }
 });
 
-test('Gemini and Anthropic need a real key; Claude Code draws in a session, retried by its finish step', async () => {
+test('Gemini and Anthropic need a real key; Claude Code draws in a session, retried by its finish step', async (t) => {
   const noKey = await svg.generateSvg({ prompt: 'x', provider: 'anthropic', confirm: 'yes' });
   assert.equal(noKey.status, 503);
   assert.match(noKey.error, /ai_providers\.anthropic\.api_key/);
+  // The rest drives Claude Code, which needs the claude CLI on this machine (#113).
+  const claude = require('../../images-providers').get('claude_code_cli').available();
+  if (!claude.ok) {
+    t.skip(`needs Claude Code: ${claude.why}`);
+    return;
+  }
   const calls = [];
   const dir = fs.mkdtempSync(path.join(os.tmpdir(), 'svgcc-'));
   try {

package/core/workspace-app/tests/unit/node-menu.test.js

@@ -153,7 +153,11 @@ test('the row shows NODE right after COMPOSER, only where there is a package.jso
   assert.strictEqual(DEFAULT_LINES[1][DEFAULT_LINES[1].indexOf('composer') + 1], 'node', 'NODE must come right after COMPOSER by default');
   assert.strictEqual((src.match(/\bnode: nodeMenu\b/g) || []).length, 1, 'handed to the layout once per row');
   const fn = src.slice(src.indexOf('function nodeMenuHtml'), src.indexOf('function openWithMenuHtml'));
-  assert.match(fn, /if \(!hasPackageJson\(projectPath\)\) return '';/, 'no package.json, no button');
+  assert.match(fn, /if \(!hasPackageJson\(projectPath\)\) return null;/, 'no package.json, no button');
+  // The row carries the button and the caption; the tabs arrive when the menu opens (#111).
+  assert.match(fn, /return menuShellHtml\('node', \{/, 'the row draws the lazy shell');
+  assert.match(src, /const CORE_ROW_MENUS = new Set\(\[[^\]]*'node'[^\]]*\]\);/, 'the core serves the NODE body itself');
+  assert.match(src, /if \(slot === 'node'\) \{\s*const body = nodeMenuBody\(key, project, projectPath, isDdev\);/, 'coreRowMenuBody answers NODE');
   assert.match(fn, /uk-tab="active: \$\{Math\.max\(0, MANAGERS\.indexOf\(info\.preferred\)\)\}"/, 'opens on the manager the project uses');
   assert.match(fn, /info\.locks\[m\] \? 'lock ✓' : 'no lock'/, 'each tab says whether its lock file is there');
   assert.match(fn, /hx-include="closest \.node-package"/);

package/core/workspace-app/tests/unit/row-menu-fragments.test.js

@@ -47,7 +47,7 @@ before(async () => {
   fs.writeFileSync(path.join(site, 'composer.lock'), '{}');
   fs.writeFileSync(path.join(site, 'package.json'), JSON.stringify({ name: 'site-one', scripts: { 'lint:js': 'eslint .' } }));
   fs.mkdirSync(path.join(root, 'dev/plain-folder'), { recursive: true });
-  for (const f of ['cmd-tools-testing.sh', 'cmd-tools-checks.sh', 'cmd-tools-add-users.sh']) fs.writeFileSync(path.join(root, 'dev', f), '#!/usr/bin/env bash\n');
+  for (const f of ['cmd-tools-testing.sh', 'cmd-tools-checks.sh', 'cmd-tools-add-users.sh', 'cmd-tools-remove.sh']) fs.writeFileSync(path.join(root, 'dev', f), '#!/usr/bin/env bash\n');
   // A package: no DDEV, a package.json that declares checks.
   const pkg = path.join(root, 'products/pkg-one');
   fs.mkdirSync(pkg, { recursive: true });
@@ -90,7 +90,7 @@ test('a project row carries the button, the caption and an empty shell for each
   const { status, html } = await text('/dev');
   assert.strictEqual(status, 200);
   const row = rowOf(html, 'site-one');
-  for (const slot of ['ddev', 'composer', 'tests', 'screens']) {
+  for (const slot of ['ddev', 'composer', 'tests', 'screens', 'node', 'more']) {
     const menu = menuOf(row, slot);
     assert.ok(menu, `${slot}: the row has the menu`);
     assert.match(menu, new RegExp(`hx-get="/fragments/row-menu/${slot}/dev/site-one"`), `${slot}: the shell asks the core route for its body`);
@@ -108,8 +108,12 @@ test('a project row carries the button, the caption and an empty shell for each
   assert.match(menuOf(row, 'tests'), /uk-button-secondary/, 'the Tests button as it was');
   assert.match(menuOf(row, 'screens'), /hx-trigger="menu-opened, load, every 30s, screens-changed from:body"/, 'SCREENS still polls: the hand and the agent badge ride on its answer');
   assert.match(menuOf(row, 'screens'), /<span class="act-status uk-text-meta">none<\/span>/);
+  // NODE says which lock files are there; More counts what it holds (#111).
+  assert.match(menuOf(row, 'node'), /<span class="act-status uk-text-meta">no lock<\/span>/);
+  assert.match(menuOf(row, 'node'), /class="act-menu-lazy node-dropdown"/, 'the NODE width class rides on the shell');
+  assert.match(menuOf(row, 'more'), /<span class="act-status uk-text-meta">\d+ actions?<\/span>/, 'the More caption counts the actions the body will hold');
   // Nothing of the bodies is on the page.
-  for (const inner of ['/actions/ddev-restart', '/actions/ddev-describe', '/actions/composer-install', '/actions/testing-configure', '/actions/checks-plan', 'composer-package', 'checks-sub', 'ddev-nav-columns']) {
+  for (const inner of ['/actions/ddev-restart', '/actions/ddev-describe', '/actions/composer-install', '/actions/testing-configure', '/actions/checks-plan', 'composer-package', 'checks-sub', 'ddev-nav-columns', 'node-tabs', 'node-col-commands', 'Scripts in package.json', '/fragments/projects/remove-form/dev/site-one', 'Remove the project']) {
     assert.ok(!row.includes(inner), `${inner} is not on the page before a menu opens`);
   }
   // A folder with no DDEV config has the Configure DDEV button and no DDEV menu; no composer.json, no COMPOSER.
@@ -174,7 +178,8 @@ test('the Tests body for a package is the checks alone, and a plain folder in a
   assert.match(pkg.html, /<span class="checks-alias">css<\/span>/);
   assert.ok(!pkg.html.includes('/actions/testing-configure') && !pkg.html.includes('/actions/add-users'), 'a packages workspace has no suite and no test users');
   const page = (await text('/products')).html;
-  assert.match(menuOf(rowOf(page, 'pkg-one'), 'tests'), /<span class="act-status uk-text-meta">(2 declared|deps missing)<\/span>/, 'the caption says what the package declares');
+  // Nothing on a package row posts with its name any more (NODE's body is served, #111): found by its Tests shell.
+  assert.match(menuOf(rowOf(page, 'pkg-one', '/fragments/row-menu/tests/products/pkg-one'), 'tests'), /<span class="act-status uk-text-meta">(2 declared|deps missing)<\/span>/, 'the caption says what the package declares');
   const plain = await text('/fragments/row-menu/tests/dev/plain-folder');
   assert.strictEqual(plain.status, 200);
   assert.match(plain.html, /hx-post="\/actions\/testing-configure"/);
@@ -197,13 +202,40 @@ test('the SCREENS body lists the sessions (none here), the ways to start one, an
   assert.match(legacy.html, /^\s*<li class="uk-nav-header">No screens in this project<\/li>/);
 });
 
+test('the NODE body for a site is the header, the yarn and npm tabs and the scripts of package.json (#111)', async () => {
+  const { status, html } = await text('/fragments/row-menu/node/dev/site-one');
+  assert.strictEqual(status, 200);
+  assert.match(html, /^<ul class="uk-nav uk-dropdown-nav">/);
+  assert.match(html, /Node · site-one/);
+  assert.match(html, /Runs as ddev npm \/ ddev yarn in this project\./);
+  assert.match(html, /<ul class="uk-tab node-tabs" data-keep-open uk-tab="active: \d+">/, 'the tabs keep the menu open');
+  assert.match(html, /<ul class="uk-switcher">/);
+  assert.match(html, /yarn\.lock is not here/);
+  assert.match(html, /package-lock\.json is not here/);
+  assert.match(html, /hx-include="closest \.node-package"/);
+  assert.match(html, /Scripts in package\.json/);
+  assert.match(html, /"script":"lint:js"/, 'the script from package.json is offered');
+  assert.match(html, /hx-vals='\{"workspace":"dev","projectName":"site-one","manager":"npm"\}'/, 'the items post for this project');
+});
+
+test('the More body for a site holds the remove, arranged, and the row counted it (#111)', async () => {
+  const { status, html } = await text('/fragments/row-menu/more/dev/site-one');
+  assert.strictEqual(status, 200);
+  assert.match(html, /^<ul class="uk-nav uk-dropdown-nav">/);
+  assert.match(html, /hx-get="\/fragments\/projects\/remove-form\/dev\/site-one"/);
+  assert.match(html, /Remove the project…/);
+  const page = (await text('/dev')).html;
+  const count = Number(/(\d+) actions?/.exec(menuOf(rowOf(page, 'site-one'), 'more'))[1]);
+  assert.strictEqual((html.match(/<a /g) || []).length, count, 'the row counts the actions the body holds');
+});
+
 test('a project that is not there, a menu the row would not draw, and a slot that is not a menu are 404', async () => {
   for (const [p, why] of [
     ['/fragments/row-menu/ddev/dev/no-such-project', 'no such project'],
     ['/fragments/row-menu/ddev/dev/plain-folder', 'not a DDEV project'],
     ['/fragments/row-menu/composer/dev/plain-folder', 'no composer.json'],
     ['/fragments/row-menu/ddev/products/pkg-one', 'a packages workspace has no DDEV'],
-    ['/fragments/row-menu/more/dev/site-one', 'More is drawn inline, not served'],
+    ['/fragments/row-menu/node/dev/plain-folder', 'no package.json'],
     ['/fragments/row-menu/ddev/nope/site-one', 'no such workspace'],
     ['/fragments/row-menu/ddev/dev/site-one?body=/fragments/p/x/menu', 'a core slot takes no plugin body'],
     ['/fragments/row-menu/x-plugin/dev/site-one', 'a plugin slot nobody registered'],
@@ -226,4 +258,6 @@ test('the Buttons settings page learns the lazy menus\' entries without anyone o
   assert.ok(seen.composer && Object.keys(seen.composer.groups).length > 0, 'COMPOSER has groups on record');
   assert.ok(seen.tests && Object.keys(seen.tests.groups).length > 0, 'Tests has groups on record');
   assert.ok(seen.ddev && Object.keys(seen.ddev.groups).length > 0, 'DDEV is on record from the rows themselves');
+  assert.ok(seen.node && Object.keys(seen.node.groups).length > 0, 'NODE has groups on record (learned, #111)');
+  assert.ok(seen.more && Object.keys(seen.more.groups).length > 0, 'More is on record from the rows themselves');
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webship.co/workspace",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "Webship Workspace: a container-based development workspace with a web dashboard. The core ships empty; workspace folders, hosting providers, git forges, container runtimes and features are @webship.co/workspace-<name> plugins you add one at a time.",
   "license": "GPL-2.0-or-later",
   "repository": {