@rainbow-robotics/muscat-plugin-kit 0.1.2-dev.44 → 0.1.2-dev.46

package/cli/src/devUi.mjs

@@ -1,20 +1,35 @@
-// muscat-pk dev:ui — preview the plugin inside a mini-Muscat (preview-host).
-// UI bundling: vite build --watch (uses plugin project's own node_modules/vite).
-// Falls back gracefully if Node.js or vite is not available.
+
 import { spawn, spawnSync } from "node:child_process";
+import { createServer as createNetServer } from "node:net";
 import { createRequire } from "node:module";
-import { copyFileSync, existsSync, mkdirSync, writeFileSync } from "node:fs";
+import { copyFileSync, cpSync, existsSync, mkdirSync, readFileSync, rmSync, watch } from "node:fs";
 import { homedir } from "node:os";
 import { dirname, resolve } from "node:path";
-import { SANDBOX_HTML } from "./build.mjs";
+import { fileURLToPath } from "node:url";
 import { checkKitUpdate, findPluginRoot, hasBin, kitRoot, log, parseArgs, prompt } from "./util.mjs";
 
+
+const DEV_PLUGIN_PORT = 4181;
+
+function getFreePort(preferred) {
+  return new Promise((res) => {
+    const srv = createNetServer();
+    srv.once("error", () => {
+      const s2 = createNetServer();
+      s2.listen(0, () => {
+        const { port } = s2.address();
+        s2.close(() => res(port));
+      });
+    });
+    srv.listen(preferred, () => srv.close(() => res(preferred)));
+  });
+}
+
 const PREVIEW_PKG = "@rainbow-robotics/preview-host";
 const CACHE_DIR = resolve(homedir(), ".muscat-pk");
 const CACHE_ROOT = resolve(CACHE_DIR, "node_modules", "@rainbow-robotics", "preview-host");
 
-// Dev builds go to a throwaway dir, not dist/ — dist/ is reserved for
-// build/pack output (the shippable artifact).
+
 const DEV_OUT = ".muscat-dev";
 
 function findNodeBin() {
@@ -56,17 +71,28 @@ function findPreviewHostRoot() {
   return CACHE_ROOT;
 }
 
-// Write sandbox.html + copy manifest into the dev out dir (vite doesn't generate these).
+function syncAssets(pluginRoot, outDir) {
+  const assetsSrc = resolve(pluginRoot, "assets");
+  if (existsSync(assetsSrc)) cpSync(assetsSrc, resolve(outDir, "assets"), { recursive: true });
+}
+
+
 function stageDevAssets(pluginRoot) {
   const outDir = resolve(pluginRoot, DEV_OUT);
   mkdirSync(outDir, { recursive: true });
-  writeFileSync(resolve(outDir, "sandbox.html"), SANDBOX_HTML, "utf8");
   const manifestSrc = resolve(pluginRoot, "manifest.json");
   if (existsSync(manifestSrc)) copyFileSync(manifestSrc, resolve(outDir, "manifest.json"));
+  syncAssets(pluginRoot, outDir);
   return outDir;
 }
 
-// Resolve vite bin path from the plugin root, hoisting-aware.
+function watchAssets(pluginRoot, outDir) {
+  const assetsSrc = resolve(pluginRoot, "assets");
+  if (!existsSync(assetsSrc)) return;
+  watch(assetsSrc, { recursive: true }, () => syncAssets(pluginRoot, outDir));
+}
+
+
 function findViteBin(pluginRoot) {
   try {
     const req = createRequire(resolve(pluginRoot, "package.json"));
@@ -77,53 +103,86 @@ function findViteBin(pluginRoot) {
   }
 }
 
-// Spawn vite build --watch as a background process.
-// Returns the child process, or null if vite/node not available.
-function spawnViteWatch(pluginRoot, node, { robotIp = "" } = {}) {
-  const viteBin = findViteBin(pluginRoot);
-  if (!node || !viteBin || !existsSync(viteBin)) return null;
 
-  log.step(`vite build --watch (ui/content.tsx → ${DEV_OUT}/content.js)`);
-  return spawn(node, [viteBin, "build", "--watch", "--mode", "development", "--outDir", DEV_OUT], {
+function spawnPluginDevServer(pluginRoot, node, port, readyFile, sharedRuntimeBase) {
+  if (!node || !findViteBin(pluginRoot)) return null;
+  const runner = fileURLToPath(new URL("./pluginDevServer.mjs", import.meta.url));
+
+  rmSync(resolve(pluginRoot, "node_modules", ".vite"), { recursive: true, force: true });
+  log.step(`vite dev server (HMR) starting at :${port} — ui/*.tsx`);
+
+  return spawn(node, [runner, pluginRoot, String(port), readyFile], {
     cwd: pluginRoot,
     stdio: "inherit",
-    env: { ...process.env, VITE_PLUGIN_PREVIEW: "true", ...(robotIp ? { VITE_RRS_PY_HOST: robotIp } : {}) },
+    env: {
+      ...process.env,
+      VITE_PLUGIN_PREVIEW: "true",
+      MUSCAT_PLUGIN_SHARED_RUNTIME_BASE: sharedRuntimeBase,
+    },
   });
 }
 
-// Wait until dist/content.js exists (vite initial build completes).
-function waitForInitialBuild(distDir, timeoutMs = 30_000) {
+function waitForPluginDevPort(readyFile, proc, timeoutMs = 15_000) {
+  const start = Date.now();
   return new Promise((res, rej) => {
-    const contentJs = resolve(distDir, "content.js");
-    const start = Date.now();
-    const check = () => {
-      if (existsSync(contentJs)) return res();
-      if (Date.now() - start > timeoutMs) return rej(new Error("vite initial build timed out"));
-      setTimeout(check, 300);
+    let exited = false;
+    proc.once("exit", (code) => {
+      exited = true;
+      rej(new Error(`plugin dev server exited before ready (code ${code ?? 0})`));
+    });
+
+    const tick = () => {
+      if (existsSync(readyFile)) {
+        try {
+          const { port } = JSON.parse(readFileSync(readyFile, "utf8"));
+          if (Number.isInteger(port)) return res(port);
+        } catch {
+        }
+      }
+      if (Date.now() - start > timeoutMs)
+        return rej(new Error("plugin dev server did not become ready in time"));
+      if (!exited) setTimeout(tick, 100);
     };
-    check();
+    tick();
   });
 }
 
 export async function runDevUi(args = []) {
   const parsed = parseArgs(args);
-  const port = parsed.port ?? "4180";
+  const requestedPort = Number(parsed.port ?? "4180");
   const robotIp = parsed["robot-ip"] ?? process.env.MUSCAT_ROBOT_HOST ?? await prompt("  Robot IP (skip if no robot): ");
 
   await checkKitUpdate();
   const pluginRoot = findPluginRoot();
   const outDir = stageDevAssets(pluginRoot);
+  const port = await getFreePort(requestedPort);
+  if (port !== requestedPort)
+    log.warn(`preview-host port ${requestedPort} is in use — using ${port} instead.`);
 
   if (robotIp) log.info(`MUSCAT_API_ORIGIN → http://${robotIp}:*`);
 
+  watchAssets(pluginRoot, outDir);
+
   const node = findNodeBin();
-  const viteProc = spawnViteWatch(pluginRoot, node, { robotIp });
+  const readyFile = resolve(outDir, "plugin-dev-port.json");
+  rmSync(readyFile, { force: true });
+  const sharedRuntimeBase = `http://localhost:${port}/plugin-shared`;
+  const viteProc = spawnPluginDevServer(
+    pluginRoot,
+    node,
+    DEV_PLUGIN_PORT,
+    readyFile,
+    sharedRuntimeBase,
+  );
+  let devPort = DEV_PLUGIN_PORT;
 
-  if (viteProc) {
-    log.step("waiting for initial vite build…");
-    await waitForInitialBuild(outDir);
+  if (!viteProc) {
+    log.warn("vite not found — UI will not load. Run `npm install` in the plugin project.");
   } else {
-    log.warn("vite not found — UI will not be bundled. Run `npm install` in the plugin project.");
+    devPort = await waitForPluginDevPort(readyFile, viteProc);
+    viteProc.on("exit", (code) => {
+      if (code) log.warn(`plugin dev server exited (code ${code}) — UI won't load (is :${devPort} free?).`);
+    });
   }
 
   const previewRoot = findPreviewHostRoot();
@@ -133,6 +192,7 @@ export async function runDevUi(args = []) {
     await new Promise((res, rej) => {
       const p = spawn(node ?? process.execPath, [resolve(previewRoot, "build.mjs")], {
         stdio: "inherit",
+        env: { ...process.env, VITE_PLUGIN_PREVIEW: "true" },
       });
       p.on("exit", (c) => (c === 0 ? res() : rej(new Error("preview-host build failed"))));
     });
@@ -141,7 +201,13 @@ export async function runDevUi(args = []) {
   log.step(`starting preview-host on :${port}`);
   const child = spawn(
     node ?? process.execPath,
-    [serveEntry, "--plugin", outDir, "--port", String(port)],
+    [
+      serveEntry,
+      "--plugin", outDir,
+      "--port", String(port),
+      "--dev-server-url", `http://localhost:${devPort}`,
+      ...(robotIp ? ["--robot-host", robotIp] : []),
+    ],
     { stdio: "inherit" },
   );
 

package/cli/src/manifest.mjs

@@ -1,6 +1,7 @@
 // manifest.mjs — manifest.json schema definition and validation
 import { existsSync, readFileSync } from "node:fs";
 import { resolve } from "node:path";
+import { manifestPortRanges, validatePorts } from "./ports.mjs";
 
 export const CONTRIBUTION_POINTS = ["program.command", "toolbar", "move.rnb"];
 const ICON_SIZES = ["16", "48", "128"];
@@ -171,6 +172,7 @@ export function validateManifest(manifest) {
   validateI18nLabel(manifest.description, "description", errors);
 
   validateIcons(manifest.icons, errors);
+  validatePorts(manifest.ports, errors);
   validateRuntime(manifest.runtime, errors);
   validateContributes(manifest.contributes, errors);
 
@@ -191,3 +193,16 @@ export function assertManifest(root) {
     throw new Error(`manifest.json errors:\n${errors.map((e) => `  • ${e}`).join("\n")}`);
   return manifest;
 }
+
+export function assertManifestPorts(root) {
+  const manifest = readManifest(root);
+  if (manifest === null)
+    throw new Error("manifest.json parse failed — check JSON syntax");
+  if (Object.keys(manifest).length === 0)
+    return [];
+  const errors = [];
+  validatePorts(manifest.ports, errors);
+  if (errors.length > 0)
+    throw new Error(`manifest.json port errors:\n${errors.map((e) => `  • ${e}`).join("\n")}`);
+  return manifestPortRanges(manifest);
+}