TDD,E2E 개선, 미적용 스타일 개선

tests/unit/sectionHelpers.spec.ts

@@ -75,6 +75,32 @@ describe("sectionHelpers.computeSectionExportTokens", () => {
     expect(tokens.sectionStyleParts).toContain("overflow:hidden");
   });
 
+  it("paddingYPx / maxWidthPx / gapXPx 는 Export 토큰 styleParts 에 em 단위로 반영되어야 한다", () => {
+    const tokens = computeSectionExportTokens({
+      ...baseProps,
+      backgroundColorCustom: "#123456",
+      paddingYPx: 80,
+      maxWidthPx: 960,
+      gapXPx: 32,
+    } as SectionBlockProps);
+
+    // 섹션 wrapper: 배경색 + 세로 패딩(em)
+    expect(tokens.sectionStyleParts).toContain("background-color:#123456");
+    expect(tokens.sectionStyleParts).toContain("padding-top:5em");
+    expect(tokens.sectionStyleParts).toContain("padding-bottom:5em");
+
+    // 내부 래퍼: 최대 폭(em)
+    expect(tokens.innerWrapperStyleParts).toContain("max-width:60em");
+
+    // 컬럼 컨테이너: column-gap(em)
+    expect(tokens.columnsStyleParts).toContain("column-gap:2em");
+
+    // px 단위는 어디에도 포함되면 안 된다.
+    expectNoPxInStyleParts(tokens.sectionStyleParts);
+    expectNoPxInStyleParts(tokens.innerWrapperStyleParts);
+    expectNoPxInStyleParts(tokens.columnsStyleParts);
+  });
+
   it("Export 섹션 sectionStyleParts 에는 px 단위 값이 포함되지 않아야 한다", () => {
     const tokens = computeSectionExportTokens({
       ...baseProps,
@@ -88,6 +114,8 @@ describe("sectionHelpers.computeSectionExportTokens", () => {
     } as SectionBlockProps);
 
     expectNoPxInStyleParts(tokens.sectionStyleParts);
+    expectNoPxInStyleParts(tokens.innerWrapperStyleParts);
+    expectNoPxInStyleParts(tokens.columnsStyleParts);
   });
 });