@embeddable.com/sdk-core 3.14.2-next.1 → 3.14.2-next.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embeddable.com/sdk-core",
-  "version": "3.14.2-next.1",
+  "version": "3.14.2-next.3",
   "description": "Core Embeddable SDK module responsible for web-components bundling and publishing.",
   "keywords": [
     "embeddable",
@@ -40,7 +40,7 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@embeddable.com/core": "2.10.1",
+    "@embeddable.com/core": "2.10.2-next.1",
     "@embeddable.com/sdk-utils": "0.8.0",
     "@inquirer/prompts": "^7.2.1",
     "@stencil/core": "^4.23.0",
@@ -53,7 +53,7 @@
     "finalhandler": "^1.3.1",
     "formdata-node": "^6.0.3",
     "minimist": "^1.2.8",
-    "open": "^9.1.0",
+    "open": "^10.1.2",
     "ora": "^8.1.1",
     "serve-static": "^1.16.2",
     "sorcery": "^1.0.0",

package/src/buildGlobalHooks.int.test.ts

@@ -15,6 +15,7 @@ import path from "node:path";
 
 const rootDir = path.resolve("fake", "root");
 const buildDir = path.resolve("fake", "build");
+const tmpDir = path.resolve("fake", "tmp");
 const srcDir = path.resolve("fake", "src");
 const lifecycleFile = path.resolve("fake", "root", "embeddable.lifecycle.ts");
 const themFile = path.resolve("fake", "root", "embeddable.theme.ts");
@@ -91,6 +92,7 @@ describe("buildGlobalHooks (Integration Tests)", () => {
       client: {
         srcDir,
         buildDir,
+        tmpDir,
         rootDir,
         lifecycleHooksFile: lifecycleFile,
         customizationFile: themFile,
@@ -188,6 +190,7 @@ describe("buildGlobalHooks (Integration Tests)", () => {
       client: {
         srcDir,
         buildDir,
+        tmpDir,
         rootDir,
         lifecycleHooksFile: lifecycleFile,
         customizationFile: themFile,

package/src/buildGlobalHooks.ts

@@ -23,6 +23,7 @@ export default async (ctx: ResolvedEmbeddableConfig) => {
   const progress = watch ? undefined : ora("Building global hooks...").start();
 
   try {
+    await fs.mkdir(ctx.client.tmpDir, { recursive: true });
     const { fileName: themeProvider, watcher: themeWatcher } =
       await buildThemeHook(ctx);
     const { lifecycleHooks, watcher: lifecycleWatcher } =
@@ -232,7 +233,7 @@ async function cleanupTemporaryHookFile(ctx: ResolvedEmbeddableConfig) {
  * Get the path to the temporary hook file in the build directory.
  */
 function getTempHookFilePath(ctx: ResolvedEmbeddableConfig): string {
-  return path.resolve(ctx.client.buildDir, TEMP_JS_HOOK_FILE);
+  return path.resolve(ctx.client.tmpDir, TEMP_JS_HOOK_FILE);
 }
 
 function waitForInitialBuild(watcher: RollupWatcher): Promise<void> {

package/src/buildGlobalHooks.unit.test.ts

@@ -70,6 +70,7 @@ describe("buildGlobalHooks (Unit Tests)", () => {
       client: {
         srcDir: path.resolve(process.cwd(), "fake", "src"),
         buildDir: path.resolve(process.cwd(), "fake", "build"),
+        tmpDir: path.resolve(process.cwd(), "fake", "tmp"),
         rootDir: path.resolve(process.cwd(), "fake", "root"),
         lifecycleHooksFile: lifecyclePath,
         componentLibraries: [],
@@ -113,6 +114,7 @@ describe("buildGlobalHooks (Unit Tests)", () => {
       client: {
         srcDir: path.resolve(process.cwd(), "fake", "src"),
         buildDir: path.resolve(process.cwd(), "fake", "build"),
+        tmpDir: path.resolve(process.cwd(), "fake", "tmp"),
         rootDir: path.resolve(process.cwd(), "fake", "root"),
         lifecycleHooksFile: lifecyclePath,
         customizationFile: themePath,
@@ -190,6 +192,7 @@ describe("buildGlobalHooks (Unit Tests)", () => {
       client: {
         srcDir: path.resolve(process.cwd(), "fake", "src"),
         buildDir: path.resolve(process.cwd(), "fake", "build"),
+        tmpDir: path.resolve(process.cwd(), "fake", "tmp"),
         rootDir: path.resolve(process.cwd(), "fake", "root"),
         lifecycleHooksFile: lifecyclePath,
         customizationFile: themePath,
@@ -242,6 +245,7 @@ describe("buildGlobalHooks (Unit Tests)", () => {
       client: {
         srcDir: path.resolve(process.cwd(), "fake", "src"),
         buildDir: path.resolve(process.cwd(), "fake", "build"),
+        tmpDir: path.resolve(process.cwd(), "fake", "tmp"),
         rootDir: path.resolve(process.cwd(), "fake", "root"),
         lifecycleHooksFile: lifecyclePath,
         customizationFile: themePath,

package/src/cleanup.ts

@@ -75,6 +75,11 @@ export async function createManifest({
 }
 
 async function extractBuild(ctx: ResolvedEmbeddableConfig) {
+  // Ensure tmpDir is removed before attempting to rename a directory to it.
+  // This helps prevent EPERM errors on Windows if tmpDir already exists and is non-empty
+  // from a previous failed run or other reasons.
+  await fs.rm(ctx.client.tmpDir, { recursive: true, force: true });
+
   const stencilBuildFiles = await findFiles(
     ctx.client.stencilBuild,
     /embeddable-wrapper.esm-[a-z0-9]+\.js/,

package/src/dev.test.ts

@@ -5,7 +5,17 @@ import provideConfig from "./provideConfig";
 import buildGlobalHooks from "./buildGlobalHooks";
 import { getToken } from "./login";
 import * as chokidar from "chokidar";
-import dev from "./dev";
+import generate from "./generate";
+import buildTypes from "./buildTypes";
+import validate from "./validate";
+import { findFiles } from "@embeddable.com/sdk-utils";
+import dev, {
+  configureWatcher,
+  buildWebComponent,
+  globalHookWatcher,
+  openDevWorkspacePage,
+  sendBuildChanges,
+} from "./dev";
 import { checkNodeVersion } from "./utils";
 import { createManifest } from "./cleanup";
 import prepare from "./prepare";
@@ -14,7 +24,9 @@ import * as open from "open";
 import { logError } from "./logger";
 import { ResolvedEmbeddableConfig } from "./defineConfig";
 import { RollupWatcher } from "rollup";
-import build from "./build";
+import ora from "ora";
+import push, { archive } from "./push";
+
 // Mock dependencies
 vi.mock("./buildTypes", () => ({ default: vi.fn() }));
 vi.mock("./buildGlobalHooks", () => ({ default: vi.fn() }));
@@ -31,18 +43,46 @@ vi.mock("chokidar", () => ({ watch: vi.fn((_) => ({ on: vi.fn() })) }));
 vi.mock("./login", () => ({ getToken: vi.fn(), default: vi.fn() }));
 vi.mock("axios", () => ({ default: { get: vi.fn(), post: vi.fn() } }));
 vi.mock("@embeddable.com/sdk-utils", () => ({ findFiles: vi.fn() }));
-vi.mock("./push", () => ({ archive: vi.fn(), sendBuild: vi.fn() }));
 vi.mock("./validate", () => ({ default: vi.fn() }));
 vi.mock("./utils", () => ({ checkNodeVersion: vi.fn() }));
 vi.mock("./cleanup", () => ({ createManifest: vi.fn() }));
 vi.mock("node:http", () => ({
   createServer: vi.fn(() => ({ listen: vi.fn() })),
 }));
+
 vi.mock("./logger", () => ({
   initLogger: vi.fn(),
   logError: vi.fn(),
 }));
 
+vi.mock("./push", async (importOriginal) => {
+  const actual = await importOriginal<typeof push>();
+  return {
+    ...actual,
+    archive: vi.fn(),
+    sendBuild: vi.fn(),
+  };
+});
+
+vi.mock("open", () => ({ default: vi.fn() }));
+vi.mock("ora", () => ({
+  default: vi.fn(() => ({
+    info: vi.fn(),
+    start: vi.fn(),
+    succeed: vi.fn(),
+    fail: vi.fn(),
+    stop: vi.fn(),
+  })),
+}));
+
+vi.mock("./dev", async (importOriginal) => {
+  const actual = await importOriginal<typeof dev>();
+  return {
+    ...actual,
+    buildWebComponent: vi.fn(),
+  };
+});
+
 const mockConfig = {
   client: {
     rootDir: "/mock/root",
@@ -58,31 +98,47 @@ const mockConfig = {
   plugins: [],
   previewBaseUrl: "http://preview.example.com",
   pushBaseUrl: "http://push.example.com",
+  pushComponents: true,
+  pushModels: true,
 };
 
 describe("dev command", () => {
   let listenMock: Mock;
+  let wsMock: any;
+  let oraMock: any;
   beforeEach(() => {
     listenMock = vi.fn();
+    wsMock = {
+      send: vi.fn(),
+    };
+    oraMock = {
+      info: vi.fn(),
+      start: vi.fn(() => oraMock),
+      succeed: vi.fn(),
+      fail: vi.fn(),
+      stop: vi.fn(),
+    };
     vi.mocked(http.createServer).mockImplementation(
       () =>
         ({
           listen: listenMock,
-        }) as any
+        }) as any,
     );
     vi.mocked(WebSocketServer).mockImplementation(() => {
       return {
-        clients: [],
+        clients: [wsMock],
         on: vi.fn(),
       } as any;
     });
 
+    vi.mocked(ora).mockImplementation(() => oraMock);
+
     // Mock process.on to avoid actually setting up process listeners
     vi.spyOn(process, "on").mockImplementation(() => process);
     vi.spyOn(process, "exit").mockImplementation(() => undefined as never);
 
     vi.mocked(provideConfig).mockResolvedValue(
-      mockConfig as unknown as ResolvedEmbeddableConfig
+      mockConfig as unknown as ResolvedEmbeddableConfig,
     );
     vi.mocked(getToken).mockResolvedValue("mock-token");
     vi.mocked(axios.get).mockResolvedValue({
@@ -98,6 +154,13 @@ describe("dev command", () => {
       themeWatcher: watcherMock,
       lifecycleWatcher: watcherMock,
     });
+
+    vi.mocked(buildWebComponent).mockImplementation(() => Promise.resolve());
+    vi.mocked(validate).mockImplementation(() => Promise.resolve(true));
+
+    vi.mocked(findFiles).mockResolvedValue([
+      ["mock-model.json", "/mock/root/models/mock-model.json"],
+    ]);
   });
 
   afterEach(() => {
@@ -130,7 +193,7 @@ describe("dev command", () => {
     await expect.poll(() => chokidar.watch).toBeCalledTimes(1);
 
     expect(open.default).toHaveBeenCalledWith(
-      "http://preview.example.com/workspace/mock-workspace"
+      "http://preview.example.com/workspace/mock-workspace",
     );
   });
 
@@ -211,4 +274,111 @@ describe("dev command", () => {
 
     console.log = originalConsoleLog;
   });
+
+  describe("configureWatcher", () => {
+    it("should configure the watcher", () => {
+      const watcher = { on: vi.fn() } as unknown as RollupWatcher;
+      configureWatcher(
+        watcher,
+        mockConfig as unknown as ResolvedEmbeddableConfig,
+      );
+
+      expect(watcher.on).toHaveBeenCalledWith("change", expect.any(Function));
+    });
+
+    it("should call generate on BUNDLE_END", async () => {
+      let onHandler: ((event: any) => void) | undefined;
+      const watcher = {
+        on: (event: string, handler: (event: any) => void) => {
+          onHandler = handler;
+        },
+      } as unknown as RollupWatcher;
+      configureWatcher(
+        watcher,
+        mockConfig as unknown as ResolvedEmbeddableConfig,
+      );
+
+      await onHandler?.({
+        code: "BUNDLE_END",
+      } as any);
+
+      expect(generate).toHaveBeenCalledWith(mockConfig, "sdk-react");
+    });
+
+    it("should call buildTypes on BUNDLE_START", async () => {
+      let onHandler: ((event: any) => void) | undefined;
+
+      const watcher = {
+        on: (event: string, handler: (event: any) => void) => {
+          onHandler = handler;
+        },
+      } as unknown as RollupWatcher;
+      configureWatcher(
+        watcher,
+        mockConfig as unknown as ResolvedEmbeddableConfig,
+      );
+
+      await onHandler?.({
+        code: "BUNDLE_START",
+      } as any);
+
+      expect(buildTypes).toHaveBeenCalledWith(mockConfig);
+    });
+  });
+
+  describe("globalHookWatcher", () => {
+    it("should call watcher.on", async () => {
+      const watcher = { on: vi.fn() } as unknown as RollupWatcher;
+      globalHookWatcher(watcher);
+
+      await expect
+        .poll(() => watcher.on)
+        .toBeCalledWith("change", expect.any(Function));
+
+      expect(watcher.on).toHaveBeenCalledWith("event", expect.any(Function));
+    });
+  });
+
+  describe("openDevWorkspacePage", () => {
+    it("should open the dev workspace page", async () => {
+      await openDevWorkspacePage(
+        "http://preview.example.com",
+        "mock-workspace",
+      );
+
+      expect(open.default).toHaveBeenCalledWith(
+        "http://preview.example.com/workspace/mock-workspace",
+      );
+
+      expect(ora).toHaveBeenCalledWith(
+        "Preview workspace is available at http://preview.example.com/workspace/mock-workspace",
+      );
+    });
+  });
+
+  describe("sendBuildChanges", () => {
+    it("should send the build changes", async () => {
+      await sendBuildChanges(mockConfig as unknown as ResolvedEmbeddableConfig);
+
+      const filesList = [
+        ...Array.from({ length: 3 }, () => [
+          "mock-model.json",
+          "/mock/root/models/mock-model.json",
+        ]),
+        [
+          "embeddable-manifest.json",
+          process.platform === "win32"
+            ? "D:\\mock\\root\\.embeddable-dev-build\\embeddable-manifest.json"
+            : "/mock/root/.embeddable-dev-build/embeddable-manifest.json",
+        ],
+      ];
+
+      expect(getToken).toHaveBeenCalled();
+      expect(archive).toHaveBeenCalledWith({
+        ctx: mockConfig,
+        filesList,
+        isDev: true,
+      });
+    });
+  });
 });

package/src/dev.ts

@@ -4,6 +4,7 @@ import buildTypes, {
 } from "./buildTypes";
 import prepare, { removeIfExists } from "./prepare";
 import generate from "./generate";
+import open from "open";
 import provideConfig from "./provideConfig";
 import {
   CompilerSystem,
@@ -56,7 +57,7 @@ const SERVER_PORT = 8926;
 const BUILD_DEV_DIR = ".embeddable-dev-build";
 const GLOBAL_CSS = "/global.css";
 
-const buildWebComponent = async (config: any) => {
+export const buildWebComponent = async (config: any) => {
   await generate(config, "sdk-react");
 };
 
@@ -114,7 +115,7 @@ export default async () => {
         stencilBuild: path.resolve(buildDir, "dist", "embeddable-wrapper"),
         tmpDir: path.resolve(
           defaultConfig.client.rootDir,
-          ".embeddable-dev-tmp"
+          ".embeddable-dev-tmp",
         ),
       },
     };
@@ -130,7 +131,7 @@ export default async () => {
     try {
       previewWorkspace = await getPreviewWorkspace(
         workspacePreparation,
-        config
+        config,
       );
     } catch (e: any) {
       if (e.response?.status === 401) {
@@ -139,11 +140,11 @@ export default async () => {
         workspacePreparation = ora("Preparing workspace...").start();
         previewWorkspace = await getPreviewWorkspace(
           workspacePreparation,
-          config
+          config,
         );
       } else {
         workspacePreparation.fail(
-          e.response?.data?.errorMessage || "Unknown error: " + e.message
+          e.response?.data?.errorMessage || "Unknown error: " + e.message,
         );
         process.exit(1);
       }
@@ -156,11 +157,11 @@ export default async () => {
         res.setHeader("Access-Control-Allow-Origin", "*");
         res.setHeader(
           "Access-Control-Allow-Methods",
-          "GET, POST, PUT, DELETE, OPTIONS"
+          "GET, POST, PUT, DELETE, OPTIONS",
         );
         res.setHeader(
           "Access-Control-Allow-Headers",
-          "Content-Type, Authorization"
+          "Content-Type, Authorization",
         );
 
         if (request.method === "OPTIONS") {
@@ -181,7 +182,7 @@ export default async () => {
         } catch {}
 
         serve(request, res, done);
-      }
+      },
     );
 
     const { themeWatcher, lifecycleWatcher } = await buildGlobalHooks(config);
@@ -191,7 +192,7 @@ export default async () => {
       const watchers: Array<RollupWatcher | FSWatcher> = [];
       if (sys?.onProcessInterrupt) {
         sys.onProcessInterrupt(
-          async () => await onClose(server, sys, watchers, config)
+          async () => await onClose(server, sys, watchers, config),
         );
       }
 
@@ -229,15 +230,15 @@ export default async () => {
         watchers.push(customGlobalCssWatch);
 
         if (themeWatcher) {
-          await globalHookWatcher(themeWatcher, config);
+          await globalHookWatcher(themeWatcher);
           watchers.push(themeWatcher);
         }
         if (lifecycleWatcher) {
-          await globalHookWatcher(lifecycleWatcher, config);
+          await globalHookWatcher(lifecycleWatcher);
           watchers.push(lifecycleWatcher);
         }
       } else {
-        await openDevWorkspacePage(config.previewBaseUrl);
+        await openDevWorkspacePage(config.previewBaseUrl, previewWorkspace);
       }
 
       const cubeSecurityContextAndClientContextWatch =
@@ -251,9 +252,9 @@ export default async () => {
   }
 };
 
-const configureWatcher = async (
+export const configureWatcher = async (
   watcher: RollupWatcher,
-  ctx: ResolvedEmbeddableConfig
+  ctx: ResolvedEmbeddableConfig,
 ) => {
   watcher.on("change", (path) => {
     changedFiles.push(path);
@@ -274,7 +275,7 @@ const configureWatcher = async (
   });
 };
 
-const globalHookWatcher = async (watcher: RollupWatcher, ctx: any) => {
+export const globalHookWatcher = async (watcher: RollupWatcher) => {
   watcher.on("change", (path) => {
     changedFiles.push(path);
   });
@@ -314,9 +315,14 @@ const onBuildStart = async (ctx: ResolvedEmbeddableConfig) => {
   sendMessage("componentsBuildStart", { changedFiles });
 };
 
-const openDevWorkspacePage = async (previewBaseUrl: string) => {
-  const open = (await import("open")).default;
-  return await open(`${previewBaseUrl}/workspace/${previewWorkspace}`);
+export const openDevWorkspacePage = async (
+  previewBaseUrl: string,
+  workspaceId: string,
+) => {
+  ora(
+    `Preview workspace is available at ${previewBaseUrl}/workspace/${workspaceId}`,
+  ).info();
+  return await open(`${previewBaseUrl}/workspace/${workspaceId}`);
 };
 
 const onBundleBuildEnd = async (ctx: ResolvedEmbeddableConfig) => {
@@ -324,16 +330,19 @@ const onBundleBuildEnd = async (ctx: ResolvedEmbeddableConfig) => {
     await buildWebComponent(ctx);
   }
   if (browserWindow == null) {
-    browserWindow = await openDevWorkspacePage(ctx.previewBaseUrl);
+    browserWindow = await openDevWorkspacePage(
+      ctx.previewBaseUrl,
+      previewWorkspace,
+    );
   } else {
     sendMessage("componentsBuildSuccess");
   }
 };
 
 const cubeSecurityContextAndClientContextWatcher = async (
-  ctx: ResolvedEmbeddableConfig
+  ctx: ResolvedEmbeddableConfig,
 ): Promise<FSWatcher> => {
-  let filesToWatch: any = [];
+  let filesToWatch: string[] = [];
 
   if (ctx.pushComponents) {
     const clientContextFiles = await fg("**/*.cc.{yaml,yml}", {
@@ -374,7 +383,7 @@ const globalCssWatcher = (ctx: ResolvedEmbeddableConfig): FSWatcher => {
   return fsWatcher;
 };
 
-const sendBuildChanges = async (ctx: ResolvedEmbeddableConfig) => {
+export const sendBuildChanges = async (ctx: ResolvedEmbeddableConfig) => {
   const isValid = await validate(ctx);
 
   if (!isValid) {
@@ -382,19 +391,19 @@ const sendBuildChanges = async (ctx: ResolvedEmbeddableConfig) => {
   }
 
   const sending = ora(
-    "Synchronising data models and/or security contexts..."
+    "Synchronising data models and/or security contexts...",
   ).start();
 
   let filesList: [string, string][] = [];
   if (ctx.pushComponents) {
     const clientContextFilesList = await findFiles(
       ctx.client.presetsSrc,
-      CLIENT_CONTEXT_FILES
+      CLIENT_CONTEXT_FILES,
     );
 
     // Map the files to include their full filenames
     const clientContextFileList = [...clientContextFilesList].map(
-      (entry): [string, string] => [path.basename(entry[1]), entry[1]]
+      (entry): [string, string] => [path.basename(entry[1]), entry[1]],
     );
 
     filesList = [...clientContextFileList];
@@ -404,7 +413,7 @@ const sendBuildChanges = async (ctx: ResolvedEmbeddableConfig) => {
     const cubeFilesList = await findFiles(ctx.client.modelsSrc, CUBE_FILES);
     const securityContextFilesList = await findFiles(
       ctx.client.presetsSrc,
-      SECURITY_CONTEXT_FILES
+      SECURITY_CONTEXT_FILES,
     );
 
     // Map the files to include their full filenames
@@ -439,7 +448,7 @@ const onClose = async (
   server: Server,
   sys: CompilerSystem,
   watchers: Array<RollupWatcher | FSWatcher>,
-  config: ResolvedEmbeddableConfig
+  config: ResolvedEmbeddableConfig,
 ) => {
   server.close();
   wss.close();
@@ -460,7 +469,7 @@ const onClose = async (
 
 const getPreviewWorkspace = async (
   startedOra: Ora,
-  ctx: ResolvedEmbeddableConfig
+  ctx: ResolvedEmbeddableConfig,
 ): Promise<string> => {
   const token = await getToken();
 
@@ -489,7 +498,7 @@ const getPreviewWorkspace = async (
         headers: {
           Authorization: `Bearer ${token}`,
         },
-      }
+      },
     );
     return response.data;
   } catch (e: any) {

package/src/push.test.ts

@@ -325,15 +325,14 @@ describe("push", () => {
           ],
         },
       });
-      vi.mocked(getArgumentByKey)
-        .mockImplementation((keysArg) => {
-          const key = Array.isArray(keysArg) ? keysArg[0] : keysArg;
-          if (key === '--api-key') return 'some-key';
-          if (key === '--email') return 'valid@email.com';
-          if (key === '--message') return 'test message';
-          if (key === '--cube-version') return 'v1.34';
-          return undefined;
-        });
+      vi.mocked(getArgumentByKey).mockImplementation((keysArg) => {
+        const key = Array.isArray(keysArg) ? keysArg[0] : keysArg;
+        if (key === "--api-key") return "some-key";
+        if (key === "--email") return "valid@email.com";
+        if (key === "--message") return "test message";
+        if (key === "--cube-version") return "v1.34";
+        return undefined;
+      });
 
       await push();
 

package/src/push.ts

@@ -112,7 +112,11 @@ const publishedSectionFeedback = (
   config.pushComponents && spinnerPushing.succeed("Components published");
 };
 
-async function pushByApiKey(config: ResolvedEmbeddableConfig, spinner: any, cubeVersion?: string) {
+async function pushByApiKey(
+  config: ResolvedEmbeddableConfig,
+  spinner: any,
+  cubeVersion?: string,
+) {
   const apiKey = getArgumentByKey(["--api-key", "-k"]);
 
   if (!apiKey) {
@@ -307,7 +311,12 @@ export async function sendBuild(
     token,
     message,
     cubeVersion,
-  }: { workspaceId: string; token: string; message?: string; cubeVersion?: string },
+  }: {
+    workspaceId: string;
+    token: string;
+    message?: string;
+    cubeVersion?: string;
+  },
 ) {
   const form = await createFormData(ctx.client.archiveFile, {
     pushModels: ctx.pushModels,