jaybe
9db7de9c79
Reviewed-on: #1 Co-authored-by: Jaybe <master@jaybe.dev> Co-committed-by: Jaybe <master@jaybe.dev>
81 lines
2.8 KiB
TypeScript
81 lines
2.8 KiB
TypeScript
import { describe, it, expect } from "vitest";
|
|
import {
|
|
createEditorStore,
|
|
type TextBlockProps,
|
|
type ButtonBlockProps,
|
|
} from "@/features/editor/state/editorStore";
|
|
|
|
// 에디터 상태 스토어에 대한 첫 TDD: 텍스트 블록 추가
|
|
|
|
describe("editorStore", () => {
|
|
it("addTextBlock 호출 시 텍스트 블록이 추가되고 선택되어야 한다", () => {
|
|
const store = createEditorStore();
|
|
|
|
store.getState().addTextBlock();
|
|
|
|
const { blocks, selectedBlockId } = store.getState();
|
|
|
|
expect(blocks).toHaveLength(1);
|
|
expect(blocks[0].type).toBe("text");
|
|
const textProps = blocks[0].props as TextBlockProps;
|
|
expect(textProps.text).toBe("새 텍스트");
|
|
expect(selectedBlockId).toBe(blocks[0].id);
|
|
});
|
|
|
|
it("reorderBlocks 호출 시 블록 배열 순서가 변경되어야 한다", () => {
|
|
const store = createEditorStore();
|
|
|
|
// 블록 세 개를 추가하고 각기 다른 텍스트로 수정한다.
|
|
store.getState().addTextBlock();
|
|
store.getState().addTextBlock();
|
|
store.getState().addTextBlock();
|
|
|
|
let { blocks } = store.getState();
|
|
|
|
store.getState().updateBlock(blocks[0].id, { text: "블록 A" });
|
|
store.getState().updateBlock(blocks[1].id, { text: "블록 B" });
|
|
store.getState().updateBlock(blocks[2].id, { text: "블록 C" });
|
|
|
|
const [aId, bId, cId] = blocks.map((b) => b.id);
|
|
|
|
// B를 맨 앞으로 이동시키는 순서 변경을 수행한다.
|
|
store.getState().reorderBlocks(bId, aId);
|
|
|
|
blocks = store.getState().blocks;
|
|
|
|
expect(blocks.map((b) => b.id)).toEqual([bId, aId, cId]);
|
|
expect(blocks.map((b) => (b.props as TextBlockProps).text)).toEqual([
|
|
"블록 B",
|
|
"블록 A",
|
|
"블록 C",
|
|
]);
|
|
});
|
|
|
|
it("버튼 블록을 추가하고 라벨/링크를 업데이트할 수 있어야 한다", () => {
|
|
const store = createEditorStore();
|
|
|
|
// 텍스트 블록 외에 버튼 블록을 추가하는 액션을 호출한다고 가정한다.
|
|
store.getState().addButtonBlock();
|
|
|
|
const { blocks, selectedBlockId } = store.getState();
|
|
|
|
expect(blocks).toHaveLength(1);
|
|
expect(blocks[0].type).toBe("button");
|
|
const buttonProps = blocks[0].props as ButtonBlockProps;
|
|
expect(buttonProps.label).toBe("버튼");
|
|
expect(buttonProps.href).toBe("#");
|
|
|
|
// 버튼 라벨과 링크를 업데이트한다.
|
|
store.getState().updateBlock(blocks[0].id, {
|
|
label: "자세히 보기",
|
|
href: "https://example.com",
|
|
} as any);
|
|
|
|
const { blocks: updatedBlocks } = store.getState();
|
|
const updatedButtonProps = updatedBlocks[0].props as ButtonBlockProps;
|
|
expect(updatedButtonProps.label).toBe("자세히 보기");
|
|
expect(updatedButtonProps.href).toBe("https://example.com");
|
|
expect(selectedBlockId).toBe(updatedBlocks[0].id);
|
|
});
|
|
});
|