feat: complete TechLog Studio publication flow
This commit is contained in:
DongHyeonka
@@ -1,6 +1,6 @@
|
||||
// @vitest-environment jsdom
|
||||
|
||||
import { render, screen, waitFor } from "@testing-library/react";
|
||||
import { render, screen, waitFor, within } from "@testing-library/react";
|
||||
import userEvent from "@testing-library/user-event";
|
||||
import { describe, expect, expectTypeOf, it } from "vitest";
|
||||
import { z } from "zod";
|
||||
@@ -12,6 +12,8 @@ import {
|
||||
} from "react-router-dom";
|
||||
|
||||
import { createAnonymousSessionAdapter } from "../../src/adapters/auth/external-session-adapter.ts";
|
||||
import { createTechLogFeatureInstalledInput } from "../../src/features/tech-log/adapters/create-tech-log-feature-input.ts";
|
||||
import { TECH_LOG_FEATURE_ID } from "../../src/features/tech-log/application/tech-log-feature-input.ts";
|
||||
import { ApplicationProvider } from "../../src/presentation/providers/application-provider.tsx";
|
||||
import {
|
||||
AppRouter,
|
||||
@@ -54,7 +56,7 @@ const groupedFixtureCodecs = Object.freeze({
|
||||
|
||||
const reviewFixtureRegistry = Object.freeze({
|
||||
REVIEW_FIXTURE: Object.freeze({
|
||||
...ROUTE_REGISTRY.APP_HOME,
|
||||
...ROUTE_REGISTRY.TECH_LOG_HOME,
|
||||
routeId: "REVIEW_FIXTURE",
|
||||
path: "/review/:reviewId",
|
||||
paramsSchema: "ReviewFixtureParams",
|
||||
@@ -100,10 +102,12 @@ function compileTimeGroupedRouteContract() {
|
||||
void compileTimeGroupedRouteContract;
|
||||
|
||||
function renderRouter() {
|
||||
const techLog = createTechLogFeatureInstalledInput();
|
||||
return render(
|
||||
<ApplicationProvider
|
||||
application={createTestApplication({
|
||||
session: createAnonymousSessionAdapter(),
|
||||
featureInputs: { [TECH_LOG_FEATURE_ID]: techLog.input },
|
||||
})}
|
||||
>
|
||||
<AppRouter />
|
||||
@@ -159,7 +163,7 @@ describe("generic application router", () => {
|
||||
|
||||
it("assembles generic Public and Studio parents with Studio catch-all precedence", () => {
|
||||
const registry = {
|
||||
APP_HOME: ROUTE_REGISTRY.APP_HOME,
|
||||
TECH_LOG_HOME: ROUTE_REGISTRY.TECH_LOG_HOME,
|
||||
STUDIO_FIXTURE: {
|
||||
...ROUTE_REGISTRY.NOT_FOUND,
|
||||
routeId: "STUDIO_FIXTURE",
|
||||
@@ -169,7 +173,7 @@ describe("generic application router", () => {
|
||||
NOT_FOUND: ROUTE_REGISTRY.NOT_FOUND,
|
||||
};
|
||||
const runtime = {
|
||||
APP_HOME: ROUTE_RUNTIME.APP_HOME,
|
||||
TECH_LOG_HOME: ROUTE_RUNTIME.TECH_LOG_HOME,
|
||||
STUDIO_FIXTURE: ROUTE_RUNTIME.NOT_FOUND,
|
||||
NOT_FOUND: ROUTE_RUNTIME.NOT_FOUND,
|
||||
};
|
||||
@@ -220,7 +224,7 @@ describe("generic application router", () => {
|
||||
"test-build",
|
||||
groupedFixtureCodecs,
|
||||
),
|
||||
).toThrow("Missing route runtime: APP_HOME");
|
||||
).toThrow("Missing route runtime: TECH_LOG_HOME");
|
||||
});
|
||||
|
||||
it("renders a non-installed Studio wildcard leaf without rewriting its URL", async () => {
|
||||
@@ -277,10 +281,11 @@ describe("generic application router", () => {
|
||||
const routes = createGroupedRouteObjects(
|
||||
{
|
||||
PROTECTED_FIXTURE: {
|
||||
...ROUTE_REGISTRY.APP_HOME,
|
||||
...ROUTE_REGISTRY.TECH_LOG_HOME,
|
||||
routeId: "PROTECTED_FIXTURE",
|
||||
path: "/private-fixture",
|
||||
access: "session-required",
|
||||
searchSchema: null,
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -317,89 +322,67 @@ describe("generic application router", () => {
|
||||
).toBeVisible();
|
||||
});
|
||||
|
||||
it("reaches the platform overview from the home starter actions", async () => {
|
||||
it("renders the installed TechLog home in the Public layout", async () => {
|
||||
const user = userEvent.setup();
|
||||
window.history.pushState({}, "", "/");
|
||||
renderRouter();
|
||||
|
||||
// The starter action lives inside the lazily loaded home chunk, so this is
|
||||
// the first wait in the file that has to outlast a chunk load rather than
|
||||
// an already-mounted shell element.
|
||||
expect(
|
||||
await screen.findByRole("heading", { name: "TechLog", level: 1 }),
|
||||
).toBeVisible();
|
||||
expect(screen.getByRole("navigation", { name: "주요 탐색" })).toBeVisible();
|
||||
await user.click(
|
||||
await screen.findByRole(
|
||||
within(screen.getByRole("navigation", { name: "주요 탐색" })).getByRole(
|
||||
"link",
|
||||
{ name: "플랫폼 구성 보기" },
|
||||
{ timeout: 5000 },
|
||||
{ name: "프로젝트" },
|
||||
),
|
||||
);
|
||||
|
||||
await waitFor(() =>
|
||||
expect(
|
||||
screen.getByRole("heading", { name: "플랫폼 구성", level: 1 }),
|
||||
).toHaveFocus(),
|
||||
);
|
||||
expect(
|
||||
await screen.findByRole("heading", { name: "프로젝트", level: 1 }),
|
||||
).toBeVisible();
|
||||
expect(window.location.pathname).toBe("/projects");
|
||||
});
|
||||
|
||||
it("renders the app shell and not-found route without a feature input", async () => {
|
||||
it("renders the Public shell and TechLog not-found route", async () => {
|
||||
window.history.pushState({}, "", "/missing");
|
||||
renderRouter();
|
||||
|
||||
expect(
|
||||
await screen.findByRole("heading", {
|
||||
name: "페이지를 찾을 수 없습니다.",
|
||||
name: "404",
|
||||
level: 1,
|
||||
}),
|
||||
).toBeVisible();
|
||||
expect(screen.getByRole("navigation", { name: "주요 탐색" })).toBeVisible();
|
||||
expect(screen.getByRole("main")).toBeVisible();
|
||||
});
|
||||
|
||||
it("preserves authorization around grouped registered leaves", async () => {
|
||||
window.history.pushState({}, "", "/examples/reference-resources");
|
||||
renderRouter();
|
||||
|
||||
expect(
|
||||
await screen.findByRole("heading", { name: "세션이 필요합니다." }),
|
||||
screen.getByRole("heading", { name: "This page could not be found." }),
|
||||
).toBeVisible();
|
||||
expect(screen.getByRole("navigation", { name: "주요 탐색" })).toBeVisible();
|
||||
});
|
||||
|
||||
it("navigates between registry-backed platform routes", async () => {
|
||||
const user = userEvent.setup();
|
||||
window.history.pushState({}, "", "/");
|
||||
it("keeps Studio routes inside the persistent Studio layout", async () => {
|
||||
window.history.pushState({}, "", "/studio");
|
||||
renderRouter();
|
||||
|
||||
await user.click(
|
||||
await screen.findByRole("link", { name: "UI 구성요소" }),
|
||||
);
|
||||
|
||||
expect(
|
||||
await screen.findByRole("heading", { name: "UI 구성요소", level: 1 }),
|
||||
await screen.findByRole("heading", { name: "작업 흐름" }),
|
||||
).toBeVisible();
|
||||
expect(window.location.pathname).toBe("/examples/ui");
|
||||
expect(document.title).toBe("UI 구성요소 · Tech Log");
|
||||
await waitFor(() =>
|
||||
expect(
|
||||
screen.getByRole("heading", { name: "UI 구성요소", level: 1 }),
|
||||
).toHaveFocus(),
|
||||
expect(screen.getByRole("navigation", { name: "Studio 주 탐색" })).toBeVisible();
|
||||
expect(screen.getByRole("link", { name: "공개 사이트 보기" })).toHaveAttribute(
|
||||
"href",
|
||||
"/",
|
||||
);
|
||||
});
|
||||
|
||||
it("focuses the route heading again when the lazy chunk is already cached", async () => {
|
||||
// §9.7. The first visit resolves the route module asynchronously, so the
|
||||
// router lifecycle and the page header commit separately. A later visit
|
||||
// renders the cached module in the same commit, which is the ordering that
|
||||
// must still hand focus to the heading rather than leaving it on main.
|
||||
const user = userEvent.setup();
|
||||
window.history.pushState({}, "", "/");
|
||||
it("gives the Studio wildcard precedence over the Public not-found route", async () => {
|
||||
window.history.pushState({}, "", "/studio/missing");
|
||||
renderRouter();
|
||||
|
||||
for (const label of ["UI 구성요소", "화면 상태", "UI 구성요소"]) {
|
||||
await user.click(await screen.findByRole("link", { name: label }));
|
||||
await waitFor(() =>
|
||||
expect(
|
||||
screen.getByRole("heading", { name: label, level: 1 }),
|
||||
).toHaveFocus(),
|
||||
);
|
||||
}
|
||||
expect(
|
||||
await screen.findByRole("heading", {
|
||||
name: "Studio 화면을 찾을 수 없습니다",
|
||||
}),
|
||||
).toBeVisible();
|
||||
expect(screen.getByRole("navigation", { name: "Studio 주 탐색" })).toBeVisible();
|
||||
expect(window.location.pathname).toBe("/studio/missing");
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user