feat(api): serve the built Dashboard from the API origin
Serve surfaces/shell's built Dashboard from apps/api on the same origin as /api (ADR 0044), exactly as the display host is served: a closed set of files read once at startup, never a static directory, never a path built from request input. - The shell exports @ekklesia/shell/dashboard-assets (the exact built index.html and script URLs), emits the script at assets/ekklesia-dashboard/app.js, and index.html names that absolute path so dev and production serve the same URLs. - GET / and GET /assets/ekklesia-dashboard/app.js answer from a frozen snapshot: no-cache with a strong ETag and 304 on match. Source maps are never served; every other path is the ordinary sanitized 404. - The page sets nosniff, X-Frame-Options: DENY, Content-Security-Policy: frame-ancestors 'none' (that directive only), and Referrer-Policy: no-referrer, on 200 and 304 alike. - A missing or empty shell build fails startup with a fixed DashboardHostAssetError before any module code is imported. - The If-None-Match comparison moves to conditional-request.ts, shared with the display host routes. - The emailed-link token stripping moves from browser/main.tsx into consumeAuthLanding (location and history injected) so it is tested; behavior is unchanged. Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
co-authored by
Claude Opus 5.5
parent
220b7b152a
commit
a12cbe9600
@@ -11,7 +11,9 @@
|
||||
<div id="ekklesia-host"></div>
|
||||
<!-- A real module script, from the same origin, with no inline script anywhere on the page:
|
||||
a deployment can therefore apply a strict script-src without exceptions, and the runtime
|
||||
`import()` of a published module artifact stays same-origin under it. -->
|
||||
<script src="./app.js" type="module"></script>
|
||||
`import()` of a published module artifact stays same-origin under it. The path is absolute
|
||||
and fixed, exactly like the display host's, so it names one host-owned route rather than a
|
||||
file relative to whatever URL served the page. -->
|
||||
<script src="/assets/ekklesia-dashboard/app.js" type="module"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -11,6 +11,10 @@
|
||||
"types": "./dist/index.d.ts",
|
||||
"import": "./dist/index.js"
|
||||
},
|
||||
"./dashboard-assets": {
|
||||
"types": "./dist/dashboard-assets.d.ts",
|
||||
"import": "./dist/dashboard-assets.js"
|
||||
},
|
||||
"./display-assets": {
|
||||
"types": "./dist/display-assets.d.ts",
|
||||
"import": "./dist/display-assets.js"
|
||||
|
||||
@@ -42,7 +42,9 @@ const buildOptions = {
|
||||
"process.env.NODE_ENV": JSON.stringify(serve ? "development" : "production"),
|
||||
},
|
||||
entryPoints: {
|
||||
app: path.join(packageDirectory, "src", "browser", "main.tsx"),
|
||||
// Emitted under the exact path `apps/api` serves it from (ADR 0044), so the development server's
|
||||
// `servedir` and production answer the same absolute URL `index.html` names.
|
||||
"assets/ekklesia-dashboard/app": path.join(packageDirectory, "src", "browser", "main.tsx"),
|
||||
"display/app": path.join(packageDirectory, "src", "display", "main.tsx"),
|
||||
// The display service worker (ADR 0043). A separate entry because a worker is a separate
|
||||
// realm with its own globals; bundling it into the page would make it unregisterable and its
|
||||
|
||||
@@ -277,3 +277,36 @@ export function readAuthLanding(search: string): HostAuthLanding | undefined {
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
|
||||
/**
|
||||
* Captures what an emailed verification or reset link asked for, then removes it from the address
|
||||
* bar.
|
||||
*
|
||||
* A password-reset token is a bearer credential for one account. Leaving it in `location.search`
|
||||
* would put it in the browser's history, in the tab title's shareable URL, and in the `Referer` of
|
||||
* anything the page subsequently loaded. `history.replaceState` rewrites the entry in place rather
|
||||
* than pushing a new one, so the Back button cannot return to the URL that held it. It is
|
||||
* deliberately *not* stored anywhere afterwards — it lives only in React state for the lifetime of
|
||||
* the reset form, and never in `localStorage` or `sessionStorage`.
|
||||
*
|
||||
* The location and history are passed in rather than read here, so this module still reads no
|
||||
* global and `browser/main.tsx` remains the shell's one browser-global boundary. Only a recognized
|
||||
* Ekklesia landing rewrites the URL; any other query is left exactly as it arrived.
|
||||
*/
|
||||
export function consumeAuthLanding(
|
||||
location: Pick<Location, "pathname" | "search">,
|
||||
history: Pick<History, "replaceState">,
|
||||
): HostAuthLanding | undefined {
|
||||
const landing = readAuthLanding(location.search);
|
||||
if (!landing) {
|
||||
return undefined;
|
||||
}
|
||||
try {
|
||||
history.replaceState(null, "", location.pathname);
|
||||
} catch {
|
||||
// A browser that refuses the rewrite (an exotic sandbox, a file: URL) must still be able to
|
||||
// finish the flow: the token is already captured, and failing here would strand the person on a
|
||||
// page that cannot do anything.
|
||||
}
|
||||
return landing;
|
||||
}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { installEkklesiaDesignTokens } from "@ekklesia/design-tokens";
|
||||
import { EkklesiaUiStyles } from "@ekklesia/ui";
|
||||
import { createRoot } from "react-dom/client";
|
||||
import { type HostAuthLanding, readAuthLanding } from "../auth-protocol.js";
|
||||
import { consumeAuthLanding } from "../auth-protocol.js";
|
||||
import type { EkklesiaHostConfig } from "../host-protocol.js";
|
||||
import { HostApp } from "./HostApp.js";
|
||||
|
||||
@@ -26,36 +26,9 @@ const config: EkklesiaHostConfig = {
|
||||
apiBaseUrl: __EKKLESIA_API_BASE_URL__ || window.location.origin,
|
||||
};
|
||||
|
||||
/**
|
||||
* Captures what an emailed verification or reset link asked for, then removes it from the address
|
||||
* bar.
|
||||
*
|
||||
* A password-reset token is a bearer credential for one account. Leaving it in `location.search`
|
||||
* would put it in the browser's history, in the tab title's shareable URL, and in the `Referer` of
|
||||
* anything the page subsequently loaded. `history.replaceState` rewrites the entry in place rather
|
||||
* than pushing a new one, so the Back button cannot return to the URL that held it. It is
|
||||
* deliberately *not* stored anywhere afterwards — it lives only in React state for the lifetime of
|
||||
* the reset form, and never in `localStorage` or `sessionStorage`.
|
||||
*
|
||||
* The parse is a pure function that recognizes only Ekklesia's own two landings, so nothing in the
|
||||
* query string can name a destination.
|
||||
*/
|
||||
function captureAuthLanding(): HostAuthLanding | undefined {
|
||||
const landing = readAuthLanding(window.location.search);
|
||||
if (!landing) {
|
||||
return undefined;
|
||||
}
|
||||
try {
|
||||
window.history.replaceState(null, "", window.location.pathname);
|
||||
} catch {
|
||||
// A browser that refuses the rewrite (an exotic sandbox, a file: URL) must still be able to
|
||||
// finish the flow: the token is already captured, and failing here would strand the person on a
|
||||
// page that cannot do anything.
|
||||
}
|
||||
return landing;
|
||||
}
|
||||
|
||||
const authLanding = captureAuthLanding();
|
||||
/** Read once, before anything renders, and stripped from the address bar in the same step. See
|
||||
* `consumeAuthLanding` for why the token must not stay in the URL. */
|
||||
const authLanding = consumeAuthLanding(window.location, window.history);
|
||||
|
||||
const container = document.getElementById("ekklesia-host");
|
||||
if (!container) {
|
||||
|
||||
@@ -0,0 +1,15 @@
|
||||
/**
|
||||
* Exact built files a deployable app may publish for the Ekklesia Dashboard (ADR 0044).
|
||||
*
|
||||
* The same shape as `./display-assets.ts`, for the same reason: these are file URLs relative to this
|
||||
* package's compiled `dist/dashboard-assets.js`, not repository paths and not request-derived
|
||||
* selectors. `apps/api` reads these exact two files before binding and serves their bytes at fixed
|
||||
* host-owned routes on the same origin as `/api`. Nothing here exposes a directory or a generic
|
||||
* static-file root, and the source map beside the script is deliberately not listed.
|
||||
*/
|
||||
const packageRoot = new URL("../", import.meta.url);
|
||||
|
||||
export const dashboardHostAssetUrls = Object.freeze({
|
||||
html: new URL("dist/browser/index.html", packageRoot).href,
|
||||
script: new URL("dist/browser/assets/ekklesia-dashboard/app.js", packageRoot).href,
|
||||
});
|
||||
@@ -1,7 +1,7 @@
|
||||
import { act } from "react";
|
||||
import { createRoot, type Root } from "react-dom/client";
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
|
||||
import { type HostAuthLanding, readAuthLanding } from "../src/auth-protocol.js";
|
||||
import { consumeAuthLanding, type HostAuthLanding, readAuthLanding } from "../src/auth-protocol.js";
|
||||
import { HostApp } from "../src/browser/HostApp.js";
|
||||
import type { EkklesiaHostConfig } from "../src/host-protocol.js";
|
||||
|
||||
@@ -140,6 +140,58 @@ async function submit(hostTestId: string): Promise<void> {
|
||||
});
|
||||
}
|
||||
|
||||
describe("consuming an emailed-link landing", () => {
|
||||
it("captures a reset token and strips the whole query from the address bar in place", () => {
|
||||
window.history.replaceState({}, "", "/?ekklesia_auth=reset-password&token=secret-reset-token");
|
||||
const lengthBefore = window.history.length;
|
||||
|
||||
const landing = consumeAuthLanding(window.location, window.history);
|
||||
|
||||
expect(landing).toEqual({ kind: "reset-password", token: "secret-reset-token" });
|
||||
expect(window.location.search).toBe("");
|
||||
expect(window.location.href).not.toContain("secret-reset-token");
|
||||
// Replaced, not pushed: Back cannot return to the entry that held the token.
|
||||
expect(window.history.length).toBe(lengthBefore);
|
||||
});
|
||||
|
||||
it("strips every recognized landing, including a failed verification and an invalid reset link", () => {
|
||||
for (const search of [
|
||||
"?ekklesia_auth=verify-email",
|
||||
"?ekklesia_auth=verify-email&error=TOKEN_EXPIRED",
|
||||
"?ekklesia_auth=reset-password&error=INVALID_TOKEN",
|
||||
"?ekklesia_auth=reset-password&token=not%20a%20valid%20token",
|
||||
]) {
|
||||
window.history.replaceState({}, "", `/${search}`);
|
||||
|
||||
expect(consumeAuthLanding(window.location, window.history), search).toBeDefined();
|
||||
expect(window.location.search, search).toBe("");
|
||||
}
|
||||
});
|
||||
|
||||
it("leaves an unrelated query untouched and rewrites nothing", () => {
|
||||
window.history.replaceState({}, "", "/?unrelated=1");
|
||||
const replaceState = vi.fn();
|
||||
|
||||
expect(consumeAuthLanding(window.location, { replaceState })).toBeUndefined();
|
||||
expect(replaceState).not.toHaveBeenCalled();
|
||||
expect(window.location.search).toBe("?unrelated=1");
|
||||
});
|
||||
|
||||
it("still returns the captured landing when the browser refuses the rewrite", () => {
|
||||
const replaceState = vi.fn(() => {
|
||||
throw new Error("SecurityError");
|
||||
});
|
||||
|
||||
expect(
|
||||
consumeAuthLanding(
|
||||
{ pathname: "/", search: "?ekklesia_auth=reset-password&token=abc123" },
|
||||
{ replaceState },
|
||||
),
|
||||
).toEqual({ kind: "reset-password", token: "abc123" });
|
||||
expect(replaceState).toHaveBeenCalledWith(null, "", "/");
|
||||
});
|
||||
});
|
||||
|
||||
describe("emailed-link landing parsing", () => {
|
||||
it("recognizes exactly Ekklesia's own two landings", () => {
|
||||
expect(readAuthLanding("?ekklesia_auth=verify-email")).toEqual({ kind: "verified" });
|
||||
|
||||
@@ -0,0 +1,55 @@
|
||||
// @vitest-environment node
|
||||
import { readFile } from "node:fs/promises";
|
||||
import path from "node:path";
|
||||
import { fileURLToPath } from "node:url";
|
||||
import { describe, expect, it } from "vitest";
|
||||
import { dashboardHostAssetUrls } from "../src/dashboard-assets.js";
|
||||
|
||||
const packageDirectory = path.dirname(path.dirname(fileURLToPath(import.meta.url)));
|
||||
|
||||
describe("Dashboard host asset locator", () => {
|
||||
it("exports only frozen immutable href strings for the two exact built files, never the source map", () => {
|
||||
expect(Object.isFrozen(dashboardHostAssetUrls)).toBe(true);
|
||||
expect(dashboardHostAssetUrls).toEqual({
|
||||
html: new URL("dist/browser/index.html", `file://${packageDirectory}/`).href,
|
||||
script: new URL(
|
||||
"dist/browser/assets/ekklesia-dashboard/app.js",
|
||||
`file://${packageDirectory}/`,
|
||||
).href,
|
||||
});
|
||||
expect(JSON.stringify(dashboardHostAssetUrls)).not.toContain(".map");
|
||||
});
|
||||
|
||||
it("publishes the locator through a narrow package subpath, not the shell root barrel", async () => {
|
||||
const manifest = JSON.parse(
|
||||
await readFile(path.join(packageDirectory, "package.json"), "utf8"),
|
||||
) as { exports?: Record<string, unknown> };
|
||||
expect(manifest.exports?.["./dashboard-assets"]).toEqual({
|
||||
import: "./dist/dashboard-assets.js",
|
||||
types: "./dist/dashboard-assets.d.ts",
|
||||
});
|
||||
|
||||
const rootSource = await readFile(path.join(packageDirectory, "src/index.ts"), "utf8");
|
||||
expect(rootSource).not.toContain("dashboardHostAssetUrls");
|
||||
expect(rootSource).not.toContain("dashboard-assets");
|
||||
});
|
||||
|
||||
it("loads exactly one fixed, absolute, same-origin script and no inline script", async () => {
|
||||
const html = await readFile(path.join(packageDirectory, "index.html"), "utf8");
|
||||
|
||||
expect(html).toContain('id="ekklesia-host"');
|
||||
expect(html.match(/<script\b/gu)).toHaveLength(1);
|
||||
expect(html).toContain(
|
||||
'<script src="/assets/ekklesia-dashboard/app.js" type="module"></script>',
|
||||
);
|
||||
});
|
||||
|
||||
it("builds the Dashboard entry at the exact path the locator names", async () => {
|
||||
const buildScript = await readFile(
|
||||
path.join(packageDirectory, "scripts/build-browser.mjs"),
|
||||
"utf8",
|
||||
);
|
||||
|
||||
expect(buildScript).toContain('"assets/ekklesia-dashboard/app": path.join(');
|
||||
});
|
||||
});
|
||||
@@ -10,6 +10,7 @@
|
||||
},
|
||||
"include": [
|
||||
"src/index.ts",
|
||||
"src/dashboard-assets.ts",
|
||||
"src/display-assets.ts",
|
||||
"src/host-protocol.ts",
|
||||
"src/module-context.ts"
|
||||
|
||||
Reference in New Issue
Block a user