feat(ai-character): Mock Preview 모드 구현

2026-07-27 23:23:36 +09:00
parent b4841ff579
commit 2a5efb0f3e
38 changed files with 4763 additions and 289 deletions
--- a/tests/e2e/server-mode-boundary.spec.ts
+++ b/tests/e2e/server-mode-boundary.spec.ts
@@ -0,0 +1,135 @@
+import { expect, test } from "@playwright/test";
+import type { Page } from "@playwright/test";
+
+const apiBaseUrl = "https://test-character-admin.sodalive.net";
+const authSession = JSON.stringify({ token: "admin-token", role: "ADMIN" });
+
+async function hasMockWorker(page: Page): Promise<boolean> {
+  return page.evaluate(async () => {
+    const registrations = await navigator.serviceWorker.getRegistrations();
+
+    return registrations.some((registration) =>
+      registration.active?.scriptURL.endsWith("/mockServiceWorker.js"),
+    );
+  });
+}
+
+test("keeps server mode requests outside browser MSW", async ({ page }) => {
+  // Given
+  await page.goto("/");
+
+  // When
+  const registeredMockWorker = await hasMockWorker(page);
+
+  // Then
+  expect(registeredMockWorker).toBe(false);
+});
+
+test("retries a server 404 without falling back to browser MSW", async ({ page }) => {
+  // Given
+  await page.addInitScript((session) => {
+    sessionStorage.setItem("ai-character-admin-auth-session", session);
+  }, authSession);
+  const protectedRouteUrl = `${apiBaseUrl}/api/v2/admin/ai-characters?page=0&size=20`;
+  let retryRequestCount = 0;
+  let releaseRetryResponse: () => void = () => undefined;
+  const retryResponseGate = new Promise<void>((resolve) => {
+    releaseRetryResponse = resolve;
+  });
+  await page.route(protectedRouteUrl, async (route) => {
+    await route.fulfill({
+      contentType: "application/json",
+      json: { success: false, message: "없습니다.", data: null, errorProperty: null },
+      status: 404,
+    });
+  });
+  await page.goto("/ai-characters");
+  const retryButton = page.getByRole("button", { name: "보호 route 다시 시도" });
+  await expect(retryButton).toBeVisible();
+  await expect(page.getByRole("alert")).toContainText("없습니다.");
+  await expect(page.getByRole("main", { name: "AI 캐릭터 관리" })).toHaveCount(0);
+  await expect(page.getByRole("button", { name: "로그아웃" })).toHaveCount(0);
+  await page.unroute(protectedRouteUrl);
+  await page.route(protectedRouteUrl, async (route) => {
+    retryRequestCount += 1;
+    await retryResponseGate;
+    await route.fulfill({
+      contentType: "application/json",
+      json: { success: true, message: null, data: null, errorProperty: null },
+      status: 200,
+    });
+  });
+
+  // When
+  await retryButton.click();
+
+  // Then
+  await expect.poll(() => retryRequestCount).toBe(1);
+  await expect(page.getByRole("status")).toContainText("보호 route 확인 중");
+  await expect(page.getByRole("main", { name: "AI 캐릭터 관리" })).toHaveCount(0);
+  await expect(page.getByRole("button", { name: "로그아웃" })).toHaveCount(0);
+  releaseRetryResponse();
+  await expect(page.getByRole("main", { name: "AI 캐릭터 관리" })).toBeVisible();
+  await expect(page.getByRole("button", { name: "로그아웃" })).toBeVisible();
+  expect(await hasMockWorker(page)).toBe(false);
+});
+
+test("keeps a network error from falling back to browser MSW", async ({ page }) => {
+  // Given
+  await page.addInitScript((session) => {
+    sessionStorage.setItem("ai-character-admin-auth-session", session);
+  }, authSession);
+  await page.route(`${apiBaseUrl}/api/v2/admin/ai-characters?page=0&size=20`, async (route) => {
+    await route.abort("failed");
+  });
+
+  // When
+  await page.goto("/ai-characters");
+
+  // Then
+  await expect(page.getByRole("alert")).toContainText("보호 route 확인에 실패했습니다.");
+  await expect(page.getByRole("main", { name: "AI 캐릭터 관리" })).toHaveCount(0);
+  await expect(page.getByRole("button", { name: "로그아웃" })).toHaveCount(0);
+  expect(await hasMockWorker(page)).toBe(false);
+});
+
+test("keeps retry available after a server network retry fails", async ({ page }) => {
+  // Given
+  await page.addInitScript((session) => {
+    sessionStorage.setItem("ai-character-admin-auth-session", session);
+  }, authSession);
+  const protectedRouteUrl = `${apiBaseUrl}/api/v2/admin/ai-characters?page=0&size=20`;
+  let retryRequestCount = 0;
+  let releaseRetryFailure: () => void = () => undefined;
+  const retryFailureGate = new Promise<void>((resolve) => {
+    releaseRetryFailure = resolve;
+  });
+  await page.route(protectedRouteUrl, async (route) => {
+    await route.abort("failed");
+  });
+  await page.goto("/ai-characters");
+  const retryButton = page.getByRole("button", { name: "보호 route 다시 시도" });
+  await expect(retryButton).toBeVisible();
+  await expect(page.getByRole("alert")).toContainText("보호 route 확인에 실패했습니다.");
+  await page.unroute(protectedRouteUrl);
+  await page.route(protectedRouteUrl, async (route) => {
+    retryRequestCount += 1;
+    await retryFailureGate;
+    await route.abort("failed");
+  });
+
+  // When
+  await retryButton.click();
+
+  // Then
+  await expect.poll(() => retryRequestCount).toBe(1);
+  await expect(page.getByRole("status")).toContainText("보호 route 확인 중");
+  await expect(page.getByRole("main", { name: "AI 캐릭터 관리" })).toHaveCount(0);
+  await expect(page.getByRole("button", { name: "로그아웃" })).toHaveCount(0);
+  releaseRetryFailure();
+  await expect(page.getByRole("button", { name: "보호 route 다시 시도" })).toBeVisible();
+  await expect(page.getByRole("alert")).toContainText("보호 route 확인에 실패했습니다.");
+  await expect(page.getByRole("main", { name: "AI 캐릭터 관리" })).toHaveCount(0);
+  await expect(page.getByRole("button", { name: "로그아웃" })).toHaveCount(0);
+  expect(await hasMockWorker(page)).toBe(false);
+});