galaxy-game/ui/frontend/tests/e2e/auth-flow.spec.ts

// 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$/);
	});
});