ekklesiaandClaude Opus 5.5
d42b64a093
CI / verify (pull_request) Successful in 1m10s
CI / infrastructure-smoke (pull_request) Successful in 34s
CI / package-release (pull_request) Successful in 52s
CI / migration-smoke (pull_request) Successful in 2m20s
CI / image-build (pull_request) Successful in 1m5s
CI / deploy-smoke (same-origin) (pull_request) Successful in 50s
CI / package-publication (pull_request) Successful in 58s
CI / deploy-smoke (split) (pull_request) Successful in 2m38s
The theme foundation DESIGN.md requires (ADR 0060): - A design token may carry a `dark` value and a `reduced` value. The token stylesheet selects them in CSS alone: dark under prefers-color-scheme unless the host chose light, or when it chose dark; motion durations zero under prefers-reduced-motion unless it allowed motion, or when it chose reduce. `color-scheme` travels with the tokens. System is live, an explicit choice wins, and every module root follows through custom-property inheritance, with no module contract change. - @ekklesia/design-tokens adds a small appearance API: system/light/dark and system/reduce/allow, parsers for untrusted stored values, resolvers, and a controller that applies the attributes immediately. The shell applies it before React renders. That is the hook the account preferences work will feed; nothing is persisted. The Dashboard page declares `color-scheme: light dark` so a dark system never flashes white. Displays stay light. - A designed dark theme: teal-tinted charcoal, never pure black or white, the same teal accent. - WCAG AA contrast is tested for 41 element pairings in both schemes. Two light pairings failed and are fixed visibly: text.muted darkens, and form controls get a new border.control (3:1). background.placeholder keeps skeletons visible in dark. - Motion tokens (duration-short, duration-ambient) replace literal durations and every per-element reduced-motion rule. radius.scale multiplies sm/md/lg, unchanged at its default of 1. - The sign-in card and module loading/error text move from literal colours to tokens. Guards keep raw colours and literal radii out of Dashboard product source and @ekklesia/ui. - Fixes ConfirmationDialog's phrase input, which used a class that does not exist (`ek-input`) and so was unstyled. Co-Authored-By: Claude Opus 5.5 <[email protected]>
81 lines
3.4 KiB
TypeScript
81 lines
3.4 KiB
TypeScript
// @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("declares both colour schemes before any script runs, and takes its background from tokens", async () => {
|
|
// So a dark system never flashes a white page while the shell loads (ADR 0060).
|
|
const html = await readFile(path.join(packageDirectory, "index.html"), "utf8");
|
|
|
|
expect(html).toContain('<meta content="light dark" name="color-scheme" />');
|
|
expect(html).toContain("background: var(--ekklesia-background-page);");
|
|
expect(html).toContain("color: var(--ekklesia-text-primary);");
|
|
});
|
|
|
|
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("carries exactly one empty API-origin meta element for the serving API to fill (ADR 0045)", async () => {
|
|
const html = await readFile(path.join(packageDirectory, "index.html"), "utf8");
|
|
|
|
expect(html.match(/name="ekklesia-api-origin"/gu)).toHaveLength(1);
|
|
expect(html).toContain('<meta content="" name="ekklesia-api-origin" />');
|
|
});
|
|
|
|
it("bakes no API origin into the bundle: the build defines nothing but NODE_ENV", async () => {
|
|
const buildScript = await readFile(
|
|
path.join(packageDirectory, "scripts/build-browser.mjs"),
|
|
"utf8",
|
|
);
|
|
|
|
expect(buildScript).not.toContain("__EKKLESIA_API_BASE_URL__");
|
|
});
|
|
|
|
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(');
|
|
});
|
|
});
|