57 lines
2.0 KiB
TypeScript
57 lines
2.0 KiB
TypeScript
import { describe, it, expect } from "vitest";
|
|
import { render } from "@testing-library/react";
|
|
import { PublicPageRenderer } from "@/features/editor/components/PublicPageRenderer";
|
|
import type { Block } from "@/features/editor/state/editorStore";
|
|
|
|
// 프리뷰 렌더러가 상위 컨테이너(프리뷰 캔버스)의 배경색을 덮어쓰지 않도록 하는 TDD
|
|
// - 루트 컨테이너는 레이아웃/텍스트 색상만 담당하고, 고정 배경색(bg-slate-950)은 사용하지 않아야 한다.
|
|
|
|
describe("PublicPageRenderer - 배경색 위임", () => {
|
|
it("루트 컨테이너는 bg-slate-950 같은 고정 배경 클래스 없이 렌더링되어야 한다", () => {
|
|
const blocks: Block[] = [];
|
|
|
|
const { container } = render(<PublicPageRenderer blocks={blocks} />);
|
|
|
|
const root = container.firstElementChild as HTMLElement | null;
|
|
expect(root).not.toBeNull();
|
|
|
|
const className = root!.getAttribute("class") ?? "";
|
|
|
|
expect(className).not.toContain("bg-slate-950");
|
|
expect(className).not.toContain("text-slate-50");
|
|
});
|
|
|
|
it("루트 텍스트/버튼 블록 영역은 고정 bg-slate-950 배경 대신 캔버스 배경을 그대로 보여야 한다", () => {
|
|
const blocks: Block[] = [
|
|
{
|
|
id: "text_root",
|
|
type: "text",
|
|
props: {
|
|
text: "텍스트",
|
|
align: "left",
|
|
size: "base",
|
|
},
|
|
} as any,
|
|
{
|
|
id: "button_root",
|
|
type: "button",
|
|
props: {
|
|
label: "버튼",
|
|
href: "#",
|
|
align: "left",
|
|
},
|
|
} as any,
|
|
];
|
|
|
|
const { container } = render(<PublicPageRenderer blocks={blocks} />);
|
|
|
|
// 섹션 블록이 하나도 없으므로, 첫 번째 <section> 은 루트 텍스트/버튼 블록을 감싸는 래퍼다.
|
|
const firstSection = container.querySelector("section");
|
|
expect(firstSection).not.toBeNull();
|
|
|
|
const className = firstSection!.getAttribute("class") ?? "";
|
|
|
|
expect(className).not.toContain("bg-slate-950");
|
|
});
|
|
});
|