diff --git a/tests/unit/ColorPickerField.spec.tsx b/tests/unit/ColorPickerField.spec.tsx
index 05b6a9b..dafec8f 100644
--- a/tests/unit/ColorPickerField.spec.tsx
+++ b/tests/unit/ColorPickerField.spec.tsx
@@ -70,8 +70,9 @@ describe("ColorPickerField - 테마", () => {
expect(toggleButton).not.toBeNull();
fireEvent.click(toggleButton!);
- // 팔레트 첫 항목("기본") 버튼을 찾는다
- const itemButton = screen.getByRole("button", { name: "기본" }) as HTMLButtonElement;
+ // 팔레트 첫 항목 버튼을 찾는다 (TEXT_COLOR_PALETTE[0] 라벨과 동기화)
+ const firstItem = TEXT_COLOR_PALETTE[0];
+ const itemButton = screen.getByRole("button", { name: firstItem.label }) as HTMLButtonElement;
const className = itemButton.getAttribute("class") ?? "";
// 라이트 모드: 흰 배경 + 어두운 텍스트
diff --git a/tests/unit/PropertiesSidebar.spec.tsx b/tests/unit/PropertiesSidebar.spec.tsx
index a9651b5..13f526c 100644
--- a/tests/unit/PropertiesSidebar.spec.tsx
+++ b/tests/unit/PropertiesSidebar.spec.tsx
@@ -144,7 +144,7 @@ describe("PropertiesSidebar HELP 튜토리얼 모달", () => {
expect(className).toContain("dark:bg-slate-950/40");
});
- it("속성 패널 루트는 pb-scroll 커스텀 스크롤바 클래스를 사용하지 않아야 한다", () => {
+ it("속성 패널 루트는 pb-scroll 커스텀 스크롤바 클래스를 사용해 에디터용 스크롤바 테마를 적용해야 한다", () => {
const props = defaultProps([], null);
render();
@@ -152,6 +152,6 @@ describe("PropertiesSidebar HELP 튜토리얼 모달", () => {
const aside = screen.getByTestId("properties-sidebar") as HTMLElement;
const className = aside.getAttribute("class") ?? "";
- expect(className).not.toContain("pb-scroll");
+ expect(className).toContain("pb-scroll");
});
});
diff --git a/tests/unit/PublicPageRendererFormFieldStyles.spec.tsx b/tests/unit/PublicPageRendererFormFieldStyles.spec.tsx
index 7658df3..370bcef 100644
--- a/tests/unit/PublicPageRendererFormFieldStyles.spec.tsx
+++ b/tests/unit/PublicPageRendererFormFieldStyles.spec.tsx
@@ -457,72 +457,52 @@ options: [
} as any,
},
];
- type: "form",
- props: {
- kind: "contact",
- submitTarget: "internal",
- requiredFieldIds: ["radio_required"],
- } as any,
- },
- {
- id: "radio_required",
- type: "formRadio",
- props: {
- groupLabel: "플랜",
- formFieldName: "plan",
- options: [
- { label: "A", value: "a" },
- { label: "B", value: "b" },
- ],
- } as any,
- },
- ];
- const { getByTestId } = render();
+const { getByTestId } = render();
- const group = getByTestId("preview-form-radio-group") as HTMLElement;
- const inputs = group.querySelectorAll("input[type='radio']");
- expect(inputs.length).toBe(2);
+const group = getByTestId("preview-form-radio-group") as HTMLElement;
+const inputs = group.querySelectorAll("input[type='radio']");
+expect(inputs.length).toBe(2);
- const first = inputs[0] as HTMLInputElement;
- const second = inputs[1] as HTMLInputElement;
+const first = inputs[0] as HTMLInputElement;
+const second = inputs[1] as HTMLInputElement;
- expect(first.type).toBe("radio");
- expect(first.name).toBe("plan");
- expect(first.value).toBe("a");
- expect(first.required).toBe(true);
+expect(first.type).toBe("radio");
+expect(first.name).toBe("plan");
+expect(first.value).toBe("a");
+expect(first.required).toBe(true);
- expect(second.type).toBe("radio");
- expect(second.name).toBe("plan");
- expect(second.value).toBe("b");
- expect(second.required).toBe(false);
- });
+expect(second.type).toBe("radio");
+expect(second.name).toBe("plan");
+expect(second.value).toBe("b");
+expect(second.required).toBe(false);
+});
- it("formCheckbox 블록의 각 옵션 라벨은 builder.css 의 pb-form-option 클래스를 사용해야 한다", () => {
- const blocks: Block[] = [
- {
- id: "form_checkbox_pb_option_class",
- type: "formCheckbox",
- props: {
- groupLabel: "옵션들",
- formFieldName: "features",
- options: [
- { label: "옵션 1", value: "opt1" },
- { label: "옵션 2", value: "opt2" },
- ],
- } as any,
- },
- ];
+ it("formCheckbox 블록의 각 옵션 라벨은 builder.css 의 pb-form-option 클래스를 사용해야 한다", () => {
+ const blocks: Block[] = [
+ {
+ id: "form_checkbox_pb_option_class",
+ type: "formCheckbox",
+ props: {
+ groupLabel: "옵션들",
+ formFieldName: "features",
+ options: [
+ { label: "옵션 1", value: "opt1" },
+ { label: "옵션 2", value: "opt2" },
+ ],
+ } as any,
+ },
+ ];
- const { getByTestId } = render();
+ const { getByTestId } = render();
- const group = getByTestId("preview-form-checkbox-group") as HTMLElement;
- const optionLabels = group.querySelectorAll("label");
- expect(optionLabels.length).toBeGreaterThan(0);
- optionLabels.forEach((label) => {
- expect((label as HTMLLabelElement).className).toContain("pb-form-option");
- });
- });
+ const group = getByTestId("preview-form-checkbox-group") as HTMLElement;
+ const optionLabels = group.querySelectorAll("label");
+ expect(optionLabels.length).toBeGreaterThan(0);
+ optionLabels.forEach((label) => {
+ expect((label as HTMLLabelElement).className).toContain("pb-form-option");
+ });
+ });
it("formRadio 프리뷰의 옵션 input 은 OS 기본 스타일을 사용하기 위해 색상 관련 Tailwind 클래스(bg-/text-/border-)를 사용하지 않아야 한다", () => {
const blocks: Block[] = [