phase 7: auth flow UI (email-code login + session resume + revocation)

Implements ui/PLAN.md Phase 7 end-to-end: - /login two-step form (email -> code) over the gateway public REST surface; /lobby placeholder issues the first authenticated user.account.get and renders the decoded display name. - SessionStore (Svelte 5 runes) with loading / unsupported / anonymous / authenticated states; layout-level route guard, browser-not-supported blocker, and a minimal SubscribeEvents revocation watcher that closes the active client within 1s on a clean stream end or Unauthenticated. - VITE_GATEWAY_BASE_URL + VITE_GATEWAY_RESPONSE_PUBLIC_KEY config plus AuthError taxonomy in api/auth.ts. - Vitest (auth-api, session-store, login-page) and Playwright e2e (auth-flow.spec.ts) on the four configured projects, with a fixture Ed25519 keypair forging Connect-Web JSON responses. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-07 15:24:21 +02:00
parent 390ad3196b
commit 22b0710d04
24 changed files with 2125 additions and 48 deletions
@@ -0,0 +1,220 @@
+// Phase 7 end-to-end coverage for the email-code login flow,
+// returning-user resume, gateway-driven session revocation, and the
+// browser-not-supported blocker. The gateway is mocked through
+// `page.route(...)`; the lobby's first authenticated `user.account.get`
+// call is answered with a forged `ExecuteCommandResponse` signed by
+// the fixture key in `fixtures/gateway-key.ts` so `GalaxyClient.
+// verifyResponse` accepts it under the matching public key the dev
+// server picks up via `VITE_GATEWAY_RESPONSE_PUBLIC_KEY`.
+//
+// The Connect-Web request URL pattern is
+//   <baseUrl>/galaxy.gateway.v1.EdgeGateway/<MethodName>
+// so the route handlers below match against the trailing path
+// suffix and ignore the host.
+
+import { fromJson, type JsonValue } from "@bufbuild/protobuf";
+import { expect, test, type Page } from "@playwright/test";
+import { ExecuteCommandRequestSchema } from "../../src/proto/galaxy/gateway/v1/edge_gateway_pb";
+import { forgeExecuteCommandResponseJson } from "./fixtures/sign-response";
+
+interface MockSetup {
+	pendingSubscribes: Array<() => void>;
+}
+
+async function mockGatewayHappyPath(
+	page: Page,
+	displayName: string,
+): Promise<MockSetup> {
+	const pendingSubscribes: Array<() => void> = [];
+
+	await page.route("**/api/v1/public/auth/send-email-code", async (route) => {
+		await route.fulfill({
+			status: 200,
+			contentType: "application/json",
+			body: JSON.stringify({ challenge_id: "ch-test-1" }),
+		});
+	});
+
+	await page.route(
+		"**/api/v1/public/auth/confirm-email-code",
+		async (route) => {
+			await route.fulfill({
+				status: 200,
+				contentType: "application/json",
+				body: JSON.stringify({ device_session_id: "dev-test-1" }),
+			});
+		},
+	);
+
+	await page.route(
+		"**/galaxy.gateway.v1.EdgeGateway/ExecuteCommand",
+		async (route) => {
+			const reqText = route.request().postData();
+			if (reqText === null) {
+				await route.fulfill({ status: 400 });
+				return;
+			}
+			const req = fromJson(
+				ExecuteCommandRequestSchema,
+				JSON.parse(reqText) as JsonValue,
+			);
+			const accountJson = JSON.stringify({
+				account: {
+					user_id: "user-1",
+					email: "pilot@example.com",
+					user_name: "player-test",
+					display_name: displayName,
+				},
+			});
+			const responseJson = await forgeExecuteCommandResponseJson({
+				requestId: req.requestId,
+				timestampMs: BigInt(Date.now()),
+				resultCode: "ok",
+				payloadBytes: new TextEncoder().encode(accountJson),
+			});
+			await route.fulfill({
+				status: 200,
+				contentType: "application/json",
+				body: responseJson,
+			});
+		},
+	);
+
+	await page.route(
+		"**/galaxy.gateway.v1.EdgeGateway/SubscribeEvents",
+		async (route) => {
+			// Hold the stream open until the test releases it via
+			// `pendingSubscribes`. Releasing fulfils with a Connect
+			// end-of-stream frame so the watcher reads a clean stream
+			// end and triggers the documented revocation path.
+			const action = await new Promise<"endOfStream" | "abort">(
+				(resolve) => {
+					pendingSubscribes.push(() => resolve("endOfStream"));
+				},
+			);
+			if (action === "abort") {
+				await route.abort();
+				return;
+			}
+			// Connect over HTTP/1.1 server-streaming framing:
+			//   1 byte flag (0x02 = end-stream)
+			//   4 bytes big-endian length
+			//   N bytes JSON body
+			// `{}` is an end-stream with no error; that's how the
+			// gateway closes a healthy stream after a session
+			// invalidation.
+			const body = new TextEncoder().encode("{}");
+			const frame = new Uint8Array(5 + body.length);
+			frame[0] = 0x02;
+			new DataView(frame.buffer).setUint32(1, body.length, false);
+			frame.set(body, 5);
+			await route.fulfill({
+				status: 200,
+				contentType: "application/connect+json",
+				body: Buffer.from(frame),
+			});
+		},
+	);
+
+	return { pendingSubscribes };
+}
+
+async function completeLogin(page: Page): Promise<void> {
+	await page.goto("/");
+	await expect(page).toHaveURL(/\/login$/);
+	await page.getByTestId("login-email-input").fill("pilot@example.com");
+	await page.getByTestId("login-email-submit").click();
+	await expect(page.getByTestId("login-code-input")).toBeVisible();
+	await page.getByTestId("login-code-input").fill("123456");
+	await page.getByTestId("login-code-submit").click();
+	await expect(page).toHaveURL(/\/lobby$/);
+}
+
+test.describe("Phase 7 — auth flow", () => {
+	// Each test runs in a fresh browser context by default, so IndexedDB
+	// starts empty on every test entry. The setup hook here is reserved
+	// for routes shared across cases.
+
+	test("fresh browser completes the email-code login and reaches the lobby", async ({
+		page,
+	}) => {
+		const mocks = await mockGatewayHappyPath(page, "Pilot");
+		await completeLogin(page);
+		await expect(page.getByTestId("device-session-id")).toHaveText(
+			"dev-test-1",
+		);
+		await expect(page.getByTestId("account-display-name")).toHaveText("Pilot");
+
+		mocks.pendingSubscribes.forEach((resolve) => resolve());
+	});
+
+	test("returning user lands on the lobby without re-login", async ({
+		page,
+	}) => {
+		const mocks = await mockGatewayHappyPath(page, "Pilot");
+		await completeLogin(page);
+		await expect(page.getByTestId("account-display-name")).toBeVisible();
+
+		await page.reload();
+		await expect(page).toHaveURL(/\/lobby$/);
+		await expect(page.getByTestId("device-session-id")).toHaveText(
+			"dev-test-1",
+		);
+
+		mocks.pendingSubscribes.forEach((resolve) => resolve());
+	});
+
+	test("server-side revocation closes the active client within one second", async ({
+		page,
+	}) => {
+		const mocks = await mockGatewayHappyPath(page, "Pilot");
+		await completeLogin(page);
+		await expect(page.getByTestId("account-display-name")).toBeVisible();
+
+		// Fire all pending SubscribeEvents requests with an empty 200
+		// response. Connect-Web's server-streaming reader sees no frames
+		// and the watcher trips into `signOut("revoked")`, which the
+		// layout effect turns into a redirect back to /login.
+		const releaseAt = Date.now();
+		mocks.pendingSubscribes.forEach((resolve) => resolve());
+
+		await expect(page).toHaveURL(/\/login$/, { timeout: 1000 });
+		expect(Date.now() - releaseAt).toBeLessThan(1500);
+	});
+
+	test("browser without WebCrypto Ed25519 shows the not-supported blocker", async ({
+		page,
+	}) => {
+		await page.addInitScript(() => {
+			// Force the SessionStore probe to fail by making
+			// generateKey reject for Ed25519 specifically. Other
+			// algorithms continue to work so unrelated browser code
+			// is not disturbed.
+			const original = crypto.subtle.generateKey.bind(crypto.subtle);
+			crypto.subtle.generateKey = ((
+				algorithm: AlgorithmIdentifier | RsaHashedKeyGenParams | EcKeyGenParams,
+				extractable: boolean,
+				keyUsages: KeyUsage[],
+			) => {
+				const name =
+					typeof algorithm === "string"
+						? algorithm
+						: (algorithm as KeyAlgorithm).name;
+				if (typeof name === "string" && name.toLowerCase() === "ed25519") {
+					return Promise.reject(
+						new DOMException("not supported", "NotSupportedError"),
+					);
+				}
+				return original(
+					algorithm as Parameters<typeof original>[0],
+					extractable,
+					keyUsages,
+				);
+			}) as typeof crypto.subtle.generateKey;
+		});
+
+		await page.goto("/");
+		await expect(page.getByText(/browser not supported/i)).toBeVisible();
+		await expect(page).not.toHaveURL(/\/login$/);
+	});
+});