@antelopejs/dms-frontend 0.5.4 → 0.5.6

package/README.md

@@ -615,6 +615,6 @@ ajs dms verify-source \
 
 The checks look for what the core layer ships: its lazily loaded chart and rich-text libraries, the pages every DMS serves and its e-mail templates. A `--layer` that holds no core layer, such as a project's own `frontend-vue`, is refused before anything is installed, with exit code 2 and the command that verifies the same folder with `--module` instead.
 
-A supplied package whose declared range excludes this adapter version is refused before anything is installed (see [Declaring the loader releases a module supports](#declaring-the-loader-releases-a-module-supports)). The verifier generates a temporary workspace, installs it, builds client, SSR, and email bundles, checks what the client bundle loads, runs `vue-tsc`, renders eight DMS email templates, and checks that the email bundle excludes browser-only modules. Each check is one line that ends in ✔ or ✖, and the run ends with `Verified <n> modules` and its duration, or with the first failure: a type or Vite error points at the file in the package you passed (`./frontend-vue/app/components/Callout.vue:17:7`), not at its copy in the workspace, and the command exits 1. `--verbose` streams the pnpm, Vite and `vue-tsc` output. The workspace is removed when the run ends. It does not start a backend or publish packages. Repository development can invoke the same runner through `pnpm test:real-source`, with `DMS_LAYER_SOURCE` set to a core layer root and `DMS_MODULE_SOURCES` to a JSON array of module roots.
+A supplied package whose declared range excludes this adapter version is refused before anything is installed (see [Declaring the loader releases a module supports](#declaring-the-loader-releases-a-module-supports)). The verifier generates a temporary workspace, installs it, builds the client, SSR and email bundles while `vue-tsc` runs alongside them (it does not compress the client assets, which only a served build needs), checks what the client bundle loads, renders eight DMS email templates, and checks that the email bundle excludes browser-only modules. Each check is one line that ends in ✔ or ✖, and the run ends with `Verified <n> modules` and its duration, or with the first failure: a type or Vite error points at the file in the package you passed (`./frontend-vue/app/components/Callout.vue:17:7`), not at its copy in the workspace, and the command exits 1. `--verbose` streams the pnpm, Vite and `vue-tsc` output. The workspace is removed when the run ends. It does not start a backend or publish packages. Repository development can invoke the same runner through `pnpm test:real-source`, with `DMS_LAYER_SOURCE` set to a core layer root and `DMS_MODULE_SOURCES` to a JSON array of module roots.
 
 Refresh rotation is single-flight within one frontend process. Horizontally scaled deployments must use sticky routing so a browser reaches the same process, or replace this process-local behavior with an external session adapter. It does not provide a distributed rotation guarantee.

package/dist/config.js

@@ -59,6 +59,7 @@ exports.TEMPLATE_FILES = [
     ["email-markup.ts", "email-markup.ts"],
     ["tsconfig.json", "tsconfig.json"],
     ["typecheck-loader.mjs", "typecheck-loader.mjs"],
+    ["prepare-types.mjs", "prepare-types.mjs"],
     ["app-config-stub.mjs", "app-config-stub.mjs"],
     ["DmsDynamicPage.vue", "DmsDynamicPage.vue"],
     ["server.mjs", "server.mjs"],

package/dist/verify-source-build.d.ts

@@ -0,0 +1,11 @@
+import { type PathMapper } from "./child-output";
+import { ViteWarnings } from "./vite-output";
+export interface VerificationContext {
+    workspace: string;
+    env: NodeJS.ProcessEnv;
+    mapLine: PathMapper;
+    warnings: ViteWarnings;
+    isVerbose: boolean;
+}
+export declare function prepareTypes(context: VerificationContext): Promise<void>;
+export declare function buildAndTypeCheck(context: VerificationContext): Promise<void>;

package/dist/verify-source-build.js

@@ -0,0 +1,113 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.prepareTypes = prepareTypes;
+exports.buildAndTypeCheck = buildAndTypeCheck;
+const node_fs_1 = require("node:fs");
+const node_path_1 = require("node:path");
+const cli_1 = require("@antelopejs/core/cli");
+const child_output_1 = require("./child-output");
+const build_action_1 = require("./commands/build-action");
+const common_1 = require("./common");
+const typecheck_output_1 = require("./typecheck-output");
+const verify_source_result_1 = require("./verify-source-result");
+const vite_output_1 = require("./vite-output");
+const VERIFY_BUILD_STEPS = build_action_1.BUILD_STEPS.filter((step) => step.script !== "build:compress");
+async function prepareTypes(context) {
+    await (0, cli_1.getProcessTasks)().run("Generating the type declarations", async (task) => {
+        const result = await (0, common_1.runFramedCommand)("pnpm", ["--silent", "run", "build:types"], {
+            name: "types",
+            cwd: context.workspace,
+            env: context.env,
+            mapLine: context.mapLine,
+        });
+        if (result.code === 0)
+            return;
+        task.fail("Type declarations failed");
+        throw new cli_1.CliError((0, child_output_1.describeChildFailure)({
+            title: "Generating the type declarations failed",
+            command: "pnpm run build:types",
+            code: result.code,
+            lines: result.lines,
+            isVerbose: context.isVerbose,
+        }));
+    }, { done: "Generated the type declarations" });
+    snapshotTypeDeclarations(context.workspace);
+}
+const AUTO_IMPORTS_DECLARATIONS = "auto-imports.d.ts";
+const AUTO_IMPORTS_SNAPSHOT = "auto-imports.verify.d.ts";
+const TYPECHECK_CONFIG = "tsconfig.verify.json";
+function snapshotTypeDeclarations(workspace) {
+    (0, node_fs_1.cpSync)((0, node_path_1.join)(workspace, AUTO_IMPORTS_DECLARATIONS), (0, node_path_1.join)(workspace, AUTO_IMPORTS_SNAPSHOT));
+    const config = JSON.parse((0, node_fs_1.readFileSync)((0, node_path_1.join)(workspace, "tsconfig.json"), "utf8"));
+    config.files = (config.files ?? []).map((file) => file === AUTO_IMPORTS_DECLARATIONS ? AUTO_IMPORTS_SNAPSHOT : file);
+    if (!config.files.includes(AUTO_IMPORTS_SNAPSHOT))
+        throw new cli_1.CliError({
+            title: `The workspace tsconfig.json does not list ${AUTO_IMPORTS_DECLARATIONS}`,
+        });
+    (0, node_fs_1.writeFileSync)((0, node_path_1.join)(workspace, TYPECHECK_CONFIG), `${JSON.stringify(config, null, 2)}\n`);
+}
+async function buildBundle(context, step, warnings) {
+    await (0, cli_1.getProcessTasks)().run(step.running, async (task) => {
+        const result = await (0, common_1.runFramedCommand)("pnpm", ["--silent", "run", step.script], {
+            name: step.name,
+            cwd: context.workspace,
+            env: context.env,
+            mapLine: context.mapLine,
+            onLine: (line) => warnings.read(line),
+        });
+        if (result.code === 0)
+            return;
+        task.fail(step.failed);
+        throw (0, build_action_1.buildStepFailure)(step, result, context.isVerbose, verify_source_result_1.VERIFY_SOURCE_COMMAND);
+    }, { done: step.done });
+}
+async function buildAndTypeCheck(context) {
+    const stepWarnings = VERIFY_BUILD_STEPS.map(() => new vite_output_1.ViteWarnings());
+    const outcomes = await Promise.allSettled([
+        ...VERIFY_BUILD_STEPS.map((step, index) => buildBundle(context, step, stepWarnings[index])),
+        typeCheck(context),
+    ]);
+    for (const warnings of stepWarnings)
+        for (const line of warnings.lines())
+            context.warnings.read(line);
+    const failure = outcomes.find((outcome) => outcome.status === "rejected");
+    if (failure)
+        throw failure.reason;
+    (0, vite_output_1.reportViteWarnings)(context.warnings, context.isVerbose, (0, cli_1.getProcessUi)());
+}
+async function typeCheck(context) {
+    const typecheckArguments = [
+        "--import",
+        "./typecheck-loader.mjs",
+        "./node_modules/vue-tsc/bin/vue-tsc.js",
+        "--project",
+        TYPECHECK_CONFIG,
+        "--noEmit",
+        "--pretty",
+    ];
+    const isWindows = process.platform === "win32";
+    const command = isWindows ? process.execPath : "env";
+    const commandArguments = isWindows
+        ? typecheckArguments
+        : ["-u", "NODE_OPTIONS", process.execPath, ...typecheckArguments];
+    await (0, cli_1.getProcessTasks)().run("Type checking", async (task) => {
+        const result = await (0, common_1.runFramedCommand)(command, commandArguments, {
+            name: "vue-tsc",
+            cwd: context.workspace,
+            mapLine: context.mapLine,
+        });
+        if (result.code === 0)
+            return;
+        const report = (0, typecheck_output_1.parseTypeCheckOutput)(result.lines);
+        const count = report.count > 0 ? [(0, cli_1.pluralize)(report.count, "error")] : [];
+        task.fail(["Type check failed", ...count].join((0, cli_1.getProcessUi)().symbols.separator));
+        throw new cli_1.CliError((0, typecheck_output_1.describeTypeCheckErrors)(report, verify_source_result_1.VERIFY_SOURCE_COMMAND) ??
+            (0, child_output_1.describeChildFailure)({
+                title: "Type check failed",
+                command: "vue-tsc --noEmit",
+                code: result.code,
+                lines: result.lines,
+                isVerbose: context.isVerbose,
+            }));
+    }, { done: "Type check passed" });
+}

package/dist/verify-source-runner.js

@@ -37,11 +37,10 @@ const node_fs_1 = require("node:fs");
 const node_path_1 = require("node:path");
 const cli_1 = require("@antelopejs/core/cli");
 const child_output_1 = require("./child-output");
-const build_action_1 = require("./commands/build-action");
 const common_1 = require("./common");
 const output_1 = require("./output");
 const temporary_workspace_1 = require("./temporary-workspace");
-const typecheck_output_1 = require("./typecheck-output");
+const verify_source_build_1 = require("./verify-source-build");
 const verify_source_result_1 = require("./verify-source-result");
 const verify_source_sources_1 = require("./verify-source-sources");
 const vite_output_1 = require("./vite-output");
@@ -95,26 +94,6 @@ function materializeWorkspace(workspace, layers, localPackages) {
     };
     (0, node_fs_1.writeFileSync)(packagePath, `${JSON.stringify(workspacePackage, null, 2)}\n`);
 }
-async function buildBundles(context) {
-    const [firstStep] = build_action_1.BUILD_STEPS;
-    await (0, cli_1.getProcessTasks)().run(firstStep.running, async (task) => {
-        for (const step of build_action_1.BUILD_STEPS) {
-            task.update(step.running);
-            const result = await (0, common_1.runFramedCommand)("pnpm", ["--silent", "run", step.script], {
-                name: step.name,
-                cwd: context.workspace,
-                env: context.env,
-                mapLine: context.mapLine,
-                onLine: (line) => context.warnings.read(line),
-            });
-            if (result.code !== 0) {
-                task.fail(step.failed);
-                throw (0, build_action_1.buildStepFailure)(step, result, context.isVerbose, verify_source_result_1.VERIFY_SOURCE_COMMAND);
-            }
-        }
-    }, { done: "Built client, SSR and e-mail bundles" });
-    (0, vite_output_1.reportViteWarnings)(context.warnings, context.isVerbose, (0, cli_1.getProcessUi)());
-}
 function checkClientBundle(workspace) {
     const clientRoot = (0, node_path_1.join)(workspace, "dist", "client");
     const manifest = readJson((0, node_path_1.join)(clientRoot, ".vite", "manifest.json"));
@@ -133,40 +112,6 @@ function checkClientBundle(workspace) {
     for (const marker of RUNTIME_MARKERS)
         ensure(javascript.includes(marker), `${marker} is not reachable at runtime`);
 }
-async function typeCheck(context) {
-    const typecheckArguments = [
-        "--import",
-        "./typecheck-loader.mjs",
-        "./node_modules/vue-tsc/bin/vue-tsc.js",
-        "--noEmit",
-        "--pretty",
-    ];
-    const isWindows = process.platform === "win32";
-    const command = isWindows ? process.execPath : "env";
-    const commandArguments = isWindows
-        ? typecheckArguments
-        : ["-u", "NODE_OPTIONS", process.execPath, ...typecheckArguments];
-    await (0, cli_1.getProcessTasks)().run("Type checking", async (task) => {
-        const result = await (0, common_1.runFramedCommand)(command, commandArguments, {
-            name: "vue-tsc",
-            cwd: context.workspace,
-            mapLine: context.mapLine,
-        });
-        if (result.code === 0)
-            return;
-        const report = (0, typecheck_output_1.parseTypeCheckOutput)(result.lines);
-        const count = report.count > 0 ? [(0, cli_1.pluralize)(report.count, "error")] : [];
-        task.fail(["Type check failed", ...count].join((0, cli_1.getProcessUi)().symbols.separator));
-        throw new cli_1.CliError((0, typecheck_output_1.describeTypeCheckErrors)(report, verify_source_result_1.VERIFY_SOURCE_COMMAND) ??
-            (0, child_output_1.describeChildFailure)({
-                title: "Type check failed",
-                command: "vue-tsc --noEmit",
-                code: result.code,
-                lines: result.lines,
-                isVerbose: context.isVerbose,
-            }));
-    }, { done: "Type check passed" });
-}
 const EMAIL_CASES = [
     {
         name: "EmailAdminInvite",
@@ -293,9 +238,9 @@ async function verifySources() {
     const tasks = (0, cli_1.getProcessTasks)();
     await tasks.run(`Materializing ${(0, cli_1.pluralize)(layers.length, "module")}`, async () => materializeWorkspace(workspace, layers, options.localPackages), { done: `Materialized ${(0, cli_1.pluralize)(layers.length, "module")}` });
     await (0, common_1.installDeps)(workspace, context.mapLine, ["--ignore-scripts"]);
-    await buildBundles(context);
+    await (0, verify_source_build_1.prepareTypes)(context);
+    await (0, verify_source_build_1.buildAndTypeCheck)(context);
     await tasks.run("Checking the client bundle", async () => checkClientBundle(workspace), { done: "Client bundle checked", failed: "Client bundle check failed" });
-    await typeCheck(context);
     await tasks.run("Checking the e-mail contracts", async () => checkEmailContracts(workspace), { done: (line) => line, failed: "E-mail contracts failed" });
     return { ok: true, modules: layers.length };
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antelopejs/dms-frontend",
-  "version": "0.5.4",
+  "version": "0.5.6",
   "description": "Frontend-agnostic loader for AntelopeJS DMS, shipping the Vue 3 renderer (Vite, Inertia, SSR)",
   "keywords": [
     "antelope",

package/templates/vue/package.json

@@ -9,6 +9,7 @@
     "build:compress": "node compress-assets.mjs",
     "build:ssr": "vite build --ssr ssr-renderer.ts --outDir dist/ssr",
     "build:email": "vite build --config vite.email.config.ts",
+    "build:types": "node prepare-types.mjs",
     "typecheck": "node --import ./typecheck-loader.mjs ./node_modules/vue-tsc/bin/vue-tsc.js --noEmit",
     "start": "node server.mjs"
   },

package/templates/vue/prepare-types.mjs

@@ -0,0 +1,34 @@
+// Writes the files Vite generates and the type check reads (auto-imports.d.ts
+// and the Nuxt UI templates) without building anything: it resolves
+// vite.config.ts and runs its build hooks over an empty entry, in seconds
+// where a client build takes a minute. `ajs dms verify-source` runs it first
+// (`pnpm run build:types`), so the type check no longer waits for the client
+// bundle.
+
+import { build } from "vite";
+
+const ENTRY = "dms-prepare-types-entry";
+const RESOLVED_ENTRY = `\0${ENTRY}`;
+
+await build({
+  configFile: "vite.config.ts",
+  plugins: [
+    {
+      name: "dms-prepare-types-entry",
+      enforce: "pre",
+      resolveId: (id) => (id === ENTRY ? RESOLVED_ENTRY : null),
+      load: (id) => (id === RESOLVED_ENTRY ? "export {};" : null),
+    },
+  ],
+  build: {
+    write: false,
+    emptyOutDir: false,
+    rollupOptions: {
+      input: ENTRY,
+      // The entry is empty on purpose.
+      onwarn: (warning, warn) => {
+        if (warning.code !== "EMPTY_BUNDLE") warn(warning);
+      },
+    },
+  },
+});

package/templates/vue/server/proxy-headers.mjs

@@ -0,0 +1,25 @@
+// Hop-by-hop headers describe the backend connection, not the client's one.
+// Forwarded, an explicit `connection: keep-alive` overrode the client's own
+// `Connection: close`, so Node kept the socket open until its idle timeout.
+const HOP_BY_HOP_HEADERS = [
+  "connection",
+  "keep-alive",
+  "proxy-connection",
+  "te",
+  "trailer",
+  "transfer-encoding",
+  "upgrade",
+];
+
+/** Writes the backend's status and end-to-end headers on `response`. */
+export function writeProxyHeaders(response, upstream) {
+  const headers = Object.fromEntries(upstream.headers);
+  const named = (headers.connection ?? "")
+    .split(",")
+    .map((name) => name.trim().toLowerCase());
+  for (const name of [...HOP_BY_HOP_HEADERS, ...named]) delete headers[name];
+  delete headers["set-cookie"];
+  const cookies = upstream.headers.getSetCookie?.() ?? [];
+  if (cookies.length) headers["set-cookie"] = cookies;
+  response.writeHead(upstream.status, headers);
+}

package/templates/vue/server/request-target.mjs

@@ -0,0 +1,53 @@
+import { writeBadRequest } from "./request-failure.mjs";
+
+// The request target as the server reads it. Node hands `request.url` over
+// verbatim, so it is not always a path: `//host/x`, `/\host/x` and the
+// absolute form `http://host/x` all name another host once resolved, which
+// turned the proxy into an open one. Every routing decision and the URL sent to
+// the backend read the same normalized path from here.
+
+const FRONTEND_ORIGIN = "http://frontend.local";
+
+/**
+ * Whether `target` is an origin-form request target: a path, optionally with a
+ * query, that stays on this server once resolved. Anything else (an absolute
+ * or authority form, `*`, a path a URL parser reads as another host) is not a
+ * request a browser sends to the frontend.
+ */
+export function isOriginForm(target) {
+  if (typeof target !== "string" || !target.startsWith("/")) return false;
+  try {
+    return new URL(target, FRONTEND_ORIGIN).origin === FRONTEND_ORIGIN;
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * The backend URL a request target is proxied to: the target's normalized path
+ * and query on the backend's origin. The path is set, not resolved, so a path
+ * normalizing to `//host` (`/x/..//host`) stays a path on the backend.
+ *
+ * @param target The request target, origin-form
+ * @param backendBaseUrl The backend's base URL
+ */
+export function backendUrl(
+  target,
+  backendBaseUrl = process.env.DMS_API_BASE_URL,
+) {
+  const { pathname, search } = new URL(target, FRONTEND_ORIGIN);
+  const url = new URL(new URL(backendBaseUrl).origin);
+  url.pathname = pathname;
+  url.search = search;
+  return url;
+}
+
+/**
+ * Answers 400 to a request whose target is not origin-form, before any route
+ * reads it. Returns whether it answered.
+ */
+export function refuseForeignTarget(request, response) {
+  if (isOriginForm(request.url)) return false;
+  writeBadRequest(response);
+  return true;
+}

package/templates/vue/server.mjs

@@ -42,6 +42,8 @@ import { HOMEPAGE } from "./server/homepage.mjs";
 import { htmlTag } from "./server/html-tag.mjs";
 import * as icons from "./server/icons.mjs";
 import * as requestFailure from "./server/request-failure.mjs";
+import { writeProxyHeaders } from "./server/proxy-headers.mjs";
+import { backendUrl, refuseForeignTarget } from "./server/request-target.mjs";
 import { handleTester } from "./server/tester.mjs";
 import {
   createInertiaPage,
@@ -193,14 +195,6 @@ async function pageProps(request) {
   }
 }
 
-function writeProxyHeaders(response, upstream) {
-  const headers = Object.fromEntries(upstream.headers);
-  delete headers["set-cookie"];
-  const cookies = upstream.headers.getSetCookie?.() ?? [];
-  if (cookies.length) headers["set-cookie"] = cookies;
-  response.writeHead(upstream.status, headers);
-}
-
 function redirectToHomepage(request, response, pathname) {
   if (pathname !== "/" || HOMEPAGE === "/") return false;
   redirectFrontendVisit(request, response, HOMEPAGE);
@@ -239,12 +233,11 @@ async function proxy(request, response, fallbackOnNotFound = false) {
     refuseCrossOrigin(response);
     return true;
   }
-  const target = new URL(request.url, process.env.DMS_API_BASE_URL);
   // Cancelling the body alone misses a client that leaves before the backend
   // answers: its stream, an SSE feed above all, then stayed open for good.
   const abandoned = new AbortController();
   response.once("close", () => abandoned.abort());
-  const upstream = await fetch(target, {
+  const upstream = await fetch(backendUrl(request.url), {
     signal: abandoned.signal,
     method: request.method,
     headers: backendHeaders(request, publicEndpoint),
@@ -505,6 +498,7 @@ async function writeRequestFailure(error, request, response) {
 
 export async function handleRequestSafely(request, response) {
   try {
+    if (refuseForeignTarget(request, response)) return;
     await handleRequest(request, response);
   } catch (error) {
     // An error page failing too must not reject: that would end the process.