dsh-panel-control 0.7.2 → 0.9.1

package/scripts/host-smoke.mjs

@@ -56,8 +56,24 @@ function check(name, ok, detail) {
 
 // The registry currently holds revision "rev-now" for this package; the page
 // below asks for "rev-old", which is the 404 that silently drops a plugin.
+const PKG_DIR = path.join(STATE, 'pkg-scan');
+await fs.mkdir(PKG_DIR, { recursive: true });
+const pkgFile = (name, body) => {
+  const file = path.join(PKG_DIR, name);
+  return fs.writeFile(file, body).then(() => file);
+};
+const pkgPaths = {
+  'dsh-panel-control': await pkgFile(
+    'panel.js',
+    "const SLOT = 'sidebar.panellist';\nconst KEY = 'panel-control';\nregister({ name: SLOT, id: KEY });\n",
+  ),
+  dshmarket: await pkgFile('market.js', "register({ name: 'sidebar.panellist', id: 'dsh-market' });\n"),
+  'billion-context': await pkgFile('bili.js', "register({ name: 'settings.section', id: 'bili' });\n"),
+};
+
 const clientModulesStub = {
   served: [],
+  clientPath: (id) => pkgPaths[id] || null,
   graph: () => ({
     rev: 'rev-test',
     release: 'rel',
@@ -65,6 +81,8 @@ const clientModulesStub = {
       { id: 'a' },
       { id: 'b' },
       { id: 'dsh-panel-control', rev: 'rev-now', url: 'plugins/??dsh-panel-control/client.js&rev=rev-now' },
+      { id: 'dshmarket', rev: 'rev-now', url: 'plugins/??dshmarket/client.js&rev=rev-now' },
+      { id: 'billion-context', rev: 'rev-now', url: 'plugins/??billion-context/client.js&rev=rev-now' },
       // The plugin that sits next to this one in the real profile: it carries no
       // fallback of its own, so a retired revision used to drop it silently
       // while the manager still reported it running.
@@ -185,11 +203,11 @@ if (route) {
     text: async () => JSON.stringify(payload),
     json: async () => payload,
   });
-  const envelope = (method) => ({
+  const envelope = (method, payload = {}) => ({
     type: 'client-request',
     rpcId: 'r1',
     method: 'dsh-panel-control/classify',
-    payload: { method, payload: {} },
+    payload: { method, payload },
   });
   try {
     const response = await route.fetch(request(envelope('inventory')));
@@ -247,9 +265,27 @@ if (route) {
     check(
       'inventory ids',
       Array.isArray(body.result.value.ids) &&
-        body.result.value.ids.join() === 'a,b,dsh-panel-control,dsh-workspace-control',
+        body.result.value.ids.join() === 'a,b,dsh-panel-control,dshmarket,billion-context,dsh-workspace-control',
       body.result.value && body.result.value.ids.join(),
     );
+    const pkgResponse = await route.fetch(
+      request(
+        envelope('packages', {
+          ids: [
+            { id: 'panel-control', slot: 'sidebar.panellist' },
+            { id: 'dsh-market', slot: 'sidebar.panellist' },
+            { id: 'bili', slot: 'settings.section' },
+            { id: 'nobody', slot: 'sidebar.panellist' },
+          ],
+        }),
+      ),
+    );
+    const pkgBody = await pkgResponse.json();
+    const packages = (pkgBody.result && pkgBody.result.value && pkgBody.result.value.packages) || {};
+    check('packages maps panel id', packages['panel-control'] === 'dsh-panel-control', JSON.stringify(packages));
+    check('packages maps market id', packages['dsh-market'] === 'dshmarket', JSON.stringify(packages));
+    check('packages maps settings id', packages.bili === 'billion-context', JSON.stringify(packages));
+    check('packages leaves unknown ids unmapped', !packages.nobody, JSON.stringify(packages));
   } catch (error) {
     check('inventory answers', false, error.message);
   }

package/scripts/layout-smoke.mjs

@@ -27,12 +27,39 @@ for (const marker of [
   'layoutGuard',
   'layoutMaxNone',
   'toggleCollapse',
+  'layoutBridge',
+  'dpc-bridgeBar',
+  'registrantOf',
+  'dpc-nameTag',
+  'data-dpc-label',
+  'applyNames',
+  'layoutTags',
 ]) {
   expect(client.includes(marker), 'client.js lost ' + marker);
 }
 
+// A bridged row is only as good as the two halves it registers: a keyed main
+// entry the layout can select, and the host-rendered settings section it shows.
+expect(client.includes('BRIDGE_ORDER = 85'), 'bridged rows lost their order slot');
+expect(client.includes('out.bridge = raw.bridge !== false'), 'the bridge switch is not persisted');
+expect(
+  client.includes('BRIDGE_SLOT_PREFIX') &&
+    client.includes('children: { [slotName]: { kind: \'single\', scope: \'root\' } }') &&
+    client.includes('renderSlot(slotName, { close: back }, {})'),
+  'the bridged page no longer renders through its own child slot',
+);
+expect(/\.dpc-bridgeBar\{[^}]*min-height:40px/.test(client), 'the bridge bar lost its 40px row height');
+
+// A renamed row keeps its host label addressable while the visible title changes;
+// the original-name tag is opt-out, and the group menu must not sit on transparency.
+expect(client.includes('out.tags = raw.tags !== false'), 'the original-name tag switch is not persisted');
+expect(/\.dpc-nameTag\{[^}]*pointer-events:none/.test(client), 'the original-name tag can intercept clicks');
+expect(/\.dpc-menu\{[^}]*background-color:var\(--dsw-alias-bg-layer-2/.test(client), 'the group menu lost its opaque base');
+expect(pkg.scripts && String(pkg.scripts.check).includes('names-smoke'), 'npm run check no longer runs the names gate');
+
 expect(client.includes("const BUILD_STAMP = 'dsh-panel-control/" + pkg.version + "'"), 'BUILD_STAMP and package.json version disagree');
 expect(pkg.scripts && String(pkg.scripts.check).includes('layout-smoke'), 'npm run check no longer runs this gate');
+expect(pkg.scripts && String(pkg.scripts.check).includes('bridge-smoke'), 'npm run check no longer runs the bridge gate');
 expect(/\[data-dpc-list\]\{[^}]*overflow-y:auto/.test(client), 'the panel list is not scrollable');
 expect(/\[data-dpc-list\]\{[^}]*max-height:max\(120px,var\(--dpc-panellist-max,45vh\)\)/.test(client), 'the panel list lost its height cap');
 expect(/\[data-dpc-region\]\{[^}]*min-height/.test(client), 'the region below the list lost its floor');

package/scripts/names-smoke.mjs

@@ -0,0 +1,425 @@
+// Behaviour gate for custom panel names and the original-name tag.
+//
+// client.js only runs inside the page module loader, so this harness loads the
+// real file in a vm with a tiny DOM and drives the real engine apply(). It
+// covers the parts a static check cannot: mapping renamed rows back to their
+// entries, the tag's placement, the switch, and the restore on dispose.
+import { readFileSync } from 'node:fs';
+import vm from 'node:vm';
+
+const SRC = readFileSync(new URL('../client.js', import.meta.url), 'utf8');
+
+const stubReact = {
+  createElement: (type, props, ...children) => ({ type, props: { ...(props || {}), children } }),
+  useState: (value) => [value, () => {}],
+  useEffect: () => {},
+  useRef: (value) => ({ current: value }),
+  useMemo: (fn) => fn(),
+  useCallback: (fn) => fn,
+};
+
+function makeEl(tag = 'div') {
+  const el = {
+    tagName: String(tag).toUpperCase(),
+    children: [],
+    parentElement: null,
+    attributes: {},
+    style: {},
+    className: '',
+    textContent: '',
+    isConnected: true,
+    _width: 260,
+    classList: {
+      contains: (name) => String(el.className).split(/\s+/).includes(name),
+      add() {},
+      remove() {},
+    },
+    setAttribute(key, value) {
+      if (key === 'class') el.className = String(value);
+      else el.attributes[key] = String(value);
+    },
+    getAttribute(key) {
+      if (key === 'class') return el.className || null;
+      return Object.prototype.hasOwnProperty.call(el.attributes, key) ? el.attributes[key] : null;
+    },
+    removeAttribute(key) {
+      delete el.attributes[key];
+    },
+    hasAttribute(key) {
+      return Object.prototype.hasOwnProperty.call(el.attributes, key);
+    },
+    appendChild(child) {
+      child.parentElement = el;
+      el.children.push(child);
+      return child;
+    },
+    remove() {
+      if (!el.parentElement) return;
+      const at = el.parentElement.children.indexOf(el);
+      if (at >= 0) el.parentElement.children.splice(at, 1);
+      el.parentElement = null;
+    },
+    addEventListener() {},
+    removeEventListener() {},
+    getBoundingClientRect() {
+      return { width: el._width, height: 40, top: 0, left: 0, right: el._width, bottom: 40 };
+    },
+    querySelectorAll(selector) {
+      return selectAll(el, selector);
+    },
+    querySelector(selector) {
+      return selectAll(el, selector)[0] || null;
+    },
+    contains(node) {
+      if (node === el) return true;
+      return el.children.some((child) => child.contains && child.contains(node));
+    },
+  };
+  return el;
+}
+
+function descendants(root) {
+  const out = [];
+  for (const child of root.children) {
+    out.push(child);
+    out.push(...descendants(child));
+  }
+  return out;
+}
+
+function selectAll(root, selector) {
+  const parts = String(selector).split(',').map((part) => part.trim());
+  const found = [];
+  for (const part of parts) {
+    let hits = [];
+    if (part === ':scope > button') {
+      hits = root.children.filter((child) => child.tagName === 'BUTTON');
+    } else if (part === 'button') {
+      hits = descendants(root).filter((child) => child.tagName === 'BUTTON');
+    } else if (part === '[data-dpc-sep]') {
+      hits = descendants(root).filter((child) => child.hasAttribute('data-dpc-sep'));
+    } else if (part === '.dpc-nameTag') {
+      hits = descendants(root).filter((child) => String(child.className).split(/\s+/).includes('dpc-nameTag'));
+    } else if (part === 'button[data-dpc-label]') {
+      hits = descendants(root).filter((child) => child.tagName === 'BUTTON' && child.hasAttribute('data-dpc-label'));
+    } else {
+      const labelled = part.match(/^button\[(data-dpc-label|aria-label)="(.*)"\]$/);
+      if (labelled) {
+        hits = descendants(root).filter(
+          (child) => child.tagName === 'BUTTON' && child.getAttribute(labelled[1]) === labelled[2],
+        );
+      }
+    }
+    for (const hit of hits) if (!found.includes(hit)) found.push(hit);
+  }
+  return found;
+}
+
+function makeButton(label, withTitle = true) {
+  const button = makeEl('button');
+  button.setAttribute('aria-label', label);
+  const glyph = makeEl('span');
+  glyph.setAttribute('aria-hidden', 'true');
+  button.appendChild(glyph);
+  if (withTitle) {
+    const title = makeEl('span');
+    title.className = 'panelTitle';
+    title.textContent = label;
+    button.appendChild(title);
+  }
+  return button;
+}
+
+function makeList(buttons, width = 260) {
+  const list = makeEl('div');
+  list.className = 'panelList-test';
+  list._width = width;
+  const parent = makeEl('div');
+  parent.appendChild(list);
+  parent.appendChild(makeEl('div'));
+  for (const button of buttons) list.appendChild(button);
+  return { list, parent };
+}
+
+function makeWindow(localPrefs) {
+  const memory = new Map();
+  if (localPrefs !== undefined) memory.set('dsh.panel-control.v1', JSON.stringify(localPrefs));
+  return {
+    document: makeDocument(),
+    localStorage: {
+      getItem: (key) => (memory.has(key) ? memory.get(key) : null),
+      setItem: (key, value) => memory.set(key, String(value)),
+      removeItem: (key) => memory.delete(key),
+    },
+    navigator: { language: 'zh-CN' },
+    location: { reload() {} },
+    CSS: { escape: (value) => String(value) },
+    addEventListener() {},
+    removeEventListener() {},
+    __DSH_BOOT__: {
+      rev: 'names-test',
+      entries: [],
+      ids: ['plugins', 'dsh-market', 'workspace-control', 'panel-control', 'dup-a', 'dup-b'],
+    },
+    __ModuleLoader__: { def: null, load(def) { this.def = def; } },
+  };
+}
+
+function makeDocument() {
+  const doc = {
+    _list: null,
+    readyState: 'loading',
+    head: makeEl('head'),
+    body: makeEl('body'),
+    documentElement: makeEl('html'),
+    title: '',
+    visibilityState: 'visible',
+    createElement: (tag) => makeEl(tag),
+    createTextNode: () => ({ textContent: '' }),
+    createDocumentFragment: () => makeEl('div'),
+    querySelectorAll(selector) {
+      if (selector === '[class*="panelList"]') return doc._list ? [doc._list] : [];
+      if (selector === 'style[data-dpc-style]') return [];
+      return doc._list ? selectAll(doc._list, selector) : [];
+    },
+    querySelector(selector) {
+      return doc.querySelectorAll(selector)[0] || null;
+    },
+    getElementById: () => null,
+    addEventListener() {},
+    removeEventListener() {},
+  };
+  return doc;
+}
+
+const calls = { selectPanel: [], effects: [] };
+const PACKAGES = {
+  plugins: '@deepseek-ai/dsh-client-ui-plugin-manager',
+  'dsh-market': 'dshmarket',
+  'panel-control': 'dsh-panel-control',
+  'dup-a': 'dsh-dup-a',
+  'dup-b': 'dsh-dup-b',
+};
+const layout = {
+  panelInfo: { getSnapshot: () => ({ activePanelId: null }) },
+  selectPanel(id) {
+    calls.selectPanel.push(id);
+  },
+};
+const locale = { getLocale: () => ({ active: 'zh-CN' }), register: () => {}, subscribe: () => () => {} };
+
+function makeCtx(registries) {
+  const makeRegistry = (name) => {
+    if (!registries.has(name)) registries.set(name, []);
+    return registries.get(name);
+  };
+  const subscribers = new Map();
+  const notify = (name) => {
+    for (const callback of subscribers.get(name) || []) Promise.resolve().then(callback);
+  };
+  const slotService = {
+    register(options, component) {
+      const record = { options, component, registrant: options.registrant || 'dsh-panel-control' };
+      makeRegistry(options.name).push(record);
+      notify(options.name);
+      return () => {
+        const all = makeRegistry(options.name);
+        const at = all.indexOf(record);
+        if (at >= 0) all.splice(at, 1);
+        notify(options.name);
+      };
+    },
+    entriesOfSlot(name) {
+      return makeRegistry(name).slice();
+    },
+    inject(name, callback) {
+      return callback();
+    },
+    subscribe(name, callback) {
+      if (!subscribers.has(name)) subscribers.set(name, []);
+      subscribers.get(name).push(callback);
+      return () => {
+        subscribers.set(name, (subscribers.get(name) || []).filter((fn) => fn !== callback));
+      };
+    },
+    renderSlot(name, props, opts) {
+      return stubReact.createElement('div', { 'data-slot': name, 'data-only': opts && opts.only });
+    },
+  };
+  return {
+    registries,
+    ctx: {
+      fiber: { name: 'dsh-panel-control' },
+      get(name) {
+        if (name === 'layout') return layout;
+        if (name === 'locale') return locale;
+        return undefined;
+      },
+      effect(fn) {
+        const dispose = fn();
+        if (typeof dispose === 'function') calls.effects.push(dispose);
+        return dispose;
+      },
+      slots: slotService,
+      connection: {
+        rpc: {
+          async call(_channel, _endpoint, message) {
+            if (message && message.method === 'packages') {
+              const ids = (message.payload && message.payload.ids) || [];
+              const packages = {};
+              for (const row of ids) if (PACKAGES[row.id]) packages[row.id] = PACKAGES[row.id];
+              return { ok: true, value: { packages, rev: 'names-test' } };
+            }
+            return { ok: true, value: {} };
+          },
+        },
+      },
+    },
+  };
+}
+
+const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+
+function seed(registries, buttons) {
+  const rows = [
+    ['plugins', '插件', 0],
+    ['dsh-market', '插件市场', 1],
+    ['workspace-control', '工作区管理', 20],
+  ];
+  for (const [id, label, order] of rows) {
+    registries.get('sidebar.panellist').push({
+      options: { name: 'sidebar.panellist', id, order, label },
+      component: () => null,
+      registrant: 'tk',
+    });
+  }
+  return rows.map(([, label]) => label);
+}
+
+async function run(localPrefs, options = {}) {
+  calls.effects.length = 0;
+  calls.selectPanel.length = 0;
+  const registries = new Map();
+  const doc = makeDocument();
+  const buttons = (options.labels || ['插件', '插件市场', '工作区管理', '面板管理']).map((label) =>
+    makeButton(label, options.withTitle !== false),
+  );
+  const { list } = makeList(buttons, options.width || 260);
+  doc._list = list;
+  const win = makeWindow(localPrefs);
+  win.document = doc;
+  const app = makeCtx(registries);
+  registries.set('sidebar.panellist', []);
+  seed(registries, buttons);
+  if (options.extraEntries) {
+    for (const [id, label, order] of options.extraEntries) {
+      registries.get('sidebar.panellist').push({
+        options: { name: 'sidebar.panellist', id, order, label },
+        component: () => null,
+        registrant: 'tk',
+      });
+    }
+  }
+
+  globalThis.window = win;
+  globalThis.document = doc;
+  globalThis.localStorage = win.localStorage;
+  globalThis.CSS = win.CSS;
+  win.__ModuleLoader__.def = null;
+  vm.runInThisContext(SRC, { filename: 'client.js' });
+  const mod = win.__ModuleLoader__.def.factory((name) => {
+    if (name === 'react') return stubReact;
+    throw new Error('unexpected require: ' + name);
+  });
+  mod.apply(app.ctx);
+  await sleep(options.wait || 420);
+  return { buttons, list, calls, ctx: app.ctx };
+}
+
+const failures = [];
+const check = (ok, message) => {
+  if (!ok) failures.push(message);
+};
+const titleOf = (button) => button.children.find((child) => child.tagName === 'SPAN' && String(child.className) !== 'dpc-nameTag' && child.getAttribute('aria-hidden') !== 'true');
+const tagOf = (button) => button.children.find((child) => String(child.className).split(/\s+/).includes('dpc-nameTag'));
+
+// 1. A renamed entry: custom text, original label addressable, one tag.
+const renamed = await run({ version: 2, names: { plugins: '我的插件' }, tags: true });
+const first = renamed.buttons[0];
+check(first.getAttribute('aria-label') === '我的插件', 'the renamed row kept its old aria-label');
+check(first.getAttribute('data-dpc-label') === '插件', 'the original label was not kept for mapping');
+check(titleOf(first) && titleOf(first).textContent === '我的插件', 'the visible title was not renamed');
+const tag = tagOf(first);
+check(Boolean(tag), 'the renamed row has no package tag');
+check(tag && tag.textContent === 'plugin-manager', 'the tag does not contain the package name');
+check(tag && tag.getAttribute('aria-hidden') === 'true', 'the tag is not hidden from assistive tech');
+check(!tagOf(renamed.buttons[1]), 'an unrenamed row grew a tag');
+check(first.style.order !== undefined, 'the engine did not apply the row order');
+
+// 2. The switch removes the tag but keeps the custom name.
+const noTags = await run({ version: 2, names: { plugins: '我的插件' }, tags: false });
+check(noTags.buttons[0].getAttribute('aria-label') === '我的插件', 'turning tags off also dropped the name');
+check(!tagOf(noTags.buttons[0]), 'the tag switch did not remove the tag');
+
+// 3. Clearing the name restores the host label.
+const cleared = await run({ version: 2, names: {}, tags: true });
+check(cleared.buttons[0].getAttribute('aria-label') === '插件', 'a cleared name did not restore the host label');
+check(titleOf(cleared.buttons[0]).textContent === '插件', 'a cleared name did not restore the title');
+check(!tagOf(cleared.buttons[0]), 'a cleared name left the tag behind');
+
+// 4. Icon rail: no title span, no tag, but the accessible name still follows.
+const rail = await run({ version: 2, names: { plugins: '我的插件' }, tags: true }, { width: 40, withTitle: false });
+check(rail.buttons[0].getAttribute('aria-label') === '我的插件', 'the rail row did not get the custom name');
+check(!tagOf(rail.buttons[0]), 'the rail row grew a tag');
+
+// 5. Duplicate labels: positional mapping still reaches both rows, and only the
+//    renamed one changes.
+const dup = await run(
+  { version: 2, names: { 'dup-a': '甲' }, tags: true },
+  {
+    labels: ['插件', '插件市场', '工作区管理', '面板管理', '相同', '相同'],
+    extraEntries: [
+      ['dup-a', '相同', 30],
+      ['dup-b', '相同', 31],
+    ],
+  },
+);
+const dupButtons = dup.buttons.slice(-2);
+check(dupButtons[0].getAttribute('aria-label') === '甲', 'the first duplicate-label row was not renamed');
+check(dupButtons[1].getAttribute('aria-label') === '相同', 'the second duplicate-label row was renamed by mistake');
+check(tagOf(dupButtons[0]).textContent === 'dup-a', 'the duplicate row tag did not use its package');
+
+// 5b. An id the Host cannot map falls back to the id itself, with `dsh-` gone.
+const unmapped = await run({ version: 2, names: { 'workspace-control': '工作区' }, tags: true });
+check(tagOf(unmapped.buttons[2]).textContent === 'workspace-control', 'an unmapped package did not fall back to its id');
+
+// 6. Dispose restores the host DOM.
+const disposed = await run({ version: 2, names: { plugins: '我的插件' }, tags: true });
+for (const dispose of disposed.calls.effects.slice().reverse()) dispose();
+check(disposed.buttons[0].getAttribute('aria-label') === '插件', 'dispose did not restore the host aria-label');
+check(titleOf(disposed.buttons[0]).textContent === '插件', 'dispose did not restore the host title');
+check(!tagOf(disposed.buttons[0]), 'dispose left the original-name tag behind');
+check(!disposed.buttons[0].getAttribute('data-dpc-label'), 'dispose left the original-label marker behind');
+
+console.log(
+  JSON.stringify(
+    {
+      renamed: Boolean(tag),
+      tag: tag ? tag.textContent : null,
+      tagsOff: !tagOf(noTags.buttons[0]),
+      restored: cleared.buttons[0].getAttribute('aria-label'),
+      railTag: Boolean(tagOf(rail.buttons[0])),
+      duplicates: dupButtons.map((button) => button.getAttribute('aria-label')),
+      unmappedTag: tagOf(unmapped.buttons[2]) ? tagOf(unmapped.buttons[2]).textContent : null,
+    },
+    null,
+    2,
+  ),
+);
+if (failures.length) {
+  console.error('names-smoke: ' + failures.length + ' problem(s)');
+  for (const failure of failures) console.error(' - ' + failure);
+  process.exit(1);
+}
+console.log('names-smoke: ok');
+process.exit(0);