67 lines
2.0 KiB
TypeScript
67 lines
2.0 KiB
TypeScript
import { describe, it, expect, vi } from "vitest";
|
|
import { render, screen, fireEvent } from "@testing-library/react";
|
|
import type { SectionBlockProps } from "@/features/editor/state/editorStore";
|
|
import { SectionPropertiesPanel } from "@/app/editor/panels/SectionPropertiesPanel";
|
|
|
|
// 섹션 레이아웃 프리셋/직접 입력이 columns 배열의 span 값을 올바르게 업데이트하는지 검증한다.
|
|
describe("SectionPropertiesPanel - layout presets", () => {
|
|
const baseProps: SectionBlockProps = {
|
|
background: "default",
|
|
paddingY: "md",
|
|
columns: [{ id: "col-1", span: 12 }],
|
|
maxWidthMode: "normal",
|
|
gapX: "md",
|
|
};
|
|
|
|
it("2열 1/2-1/2 프리셋 선택 시 columns 가 [6,6] 분할로 업데이트된다", () => {
|
|
const updateBlock = vi.fn();
|
|
|
|
render(
|
|
<SectionPropertiesPanel
|
|
sectionProps={baseProps}
|
|
selectedBlockId="section-layout-1"
|
|
updateBlock={updateBlock}
|
|
/>,
|
|
);
|
|
|
|
const select = screen.getByLabelText("섹션 컬럼 레이아웃");
|
|
|
|
fireEvent.change(select, { target: { value: "two-equal" } });
|
|
|
|
expect(updateBlock).toHaveBeenCalledWith(
|
|
"section-layout-1",
|
|
expect.objectContaining({
|
|
columns: expect.arrayContaining([
|
|
expect.objectContaining({ span: 6 }),
|
|
expect.objectContaining({ span: 6 }),
|
|
]),
|
|
}),
|
|
);
|
|
});
|
|
|
|
it("컬럼 span 직접 입력 시 해당 컬럼 span 값이 업데이트된다", () => {
|
|
const updateBlock = vi.fn();
|
|
|
|
render(
|
|
<SectionPropertiesPanel
|
|
sectionProps={baseProps}
|
|
selectedBlockId="section-layout-2"
|
|
updateBlock={updateBlock}
|
|
/>,
|
|
);
|
|
|
|
const input = screen.getByLabelText("1열 폭 (1~12)");
|
|
|
|
fireEvent.change(input, { target: { value: "8" } });
|
|
|
|
expect(updateBlock).toHaveBeenCalledWith(
|
|
"section-layout-2",
|
|
expect.objectContaining({
|
|
columns: expect.arrayContaining([
|
|
expect.objectContaining({ span: 8 }),
|
|
]),
|
|
}),
|
|
);
|
|
});
|
|
});
|