@simplysm/solid 13.0.69 → 13.0.70

package/tests/components/display/Card.spec.tsx

@@ -0,0 +1,41 @@
+import { render } from "@solidjs/testing-library";
+import { describe, it, expect } from "vitest";
+import { Card } from "../../../src/components/display/Card";
+
+describe("Card 컴포넌트", () => {
+  describe("basic rendering", () => {
+    it("children이 Card 내부에 표시된다", () => {
+      const { getByText } = render(() => <Card>Card Content</Card>);
+      expect(getByText("Card Content")).toBeTruthy();
+    });
+
+    it("renders as div element", () => {
+      const { container } = render(() => <Card>Content</Card>);
+      const card = container.firstChild as HTMLElement;
+      expect(card.tagName).toBe("DIV");
+    });
+  });
+
+  describe("class merging", () => {
+    it("merges custom classes", () => {
+      // eslint-disable-next-line tailwindcss/no-custom-classname
+      const { container } = render(() => <Card class="my-custom-class">Content</Card>);
+      const card = container.firstChild as HTMLElement;
+      expect(card.classList.contains("my-custom-class")).toBe(true);
+    });
+  });
+
+  describe("HTML attribute forwarding", () => {
+    it("passes data-* attributes", () => {
+      const { container } = render(() => <Card data-testid="test-card">Content</Card>);
+      const card = container.firstChild as HTMLElement;
+      expect(card.getAttribute("data-testid")).toBe("test-card");
+    });
+
+    it("id 속성이 전달된다", () => {
+      const { container } = render(() => <Card id="my-card">Content</Card>);
+      const card = container.firstChild as HTMLElement;
+      expect(card.id).toBe("my-card");
+    });
+  });
+});

package/tests/components/display/Link.spec.tsx

@@ -0,0 +1,62 @@
+import { render } from "@solidjs/testing-library";
+import { describe, it, expect } from "vitest";
+import { Link } from "../../../src/components/display/Link";
+
+describe("Link 컴포넌트", () => {
+  describe("basic rendering", () => {
+    it("children이 Link 내부에 표시된다", () => {
+      const { getByText } = render(() => <Link href="https://example.com">링크</Link>);
+      expect(getByText("링크")).toBeTruthy();
+    });
+
+    it("renders as link element", () => {
+      const { container } = render(() => <Link href="https://example.com">링크</Link>);
+      const link = container.firstChild as HTMLElement;
+      expect(link.tagName).toBe("A");
+    });
+  });
+
+  describe("href 속성", () => {
+    it("href가 a 요소에 전달된다", () => {
+      const { container } = render(() => <Link href="https://example.com">링크</Link>);
+      const link = container.firstChild as HTMLAnchorElement;
+      expect(link.getAttribute("href")).toBe("https://example.com");
+    });
+
+    it("target 속성이 전달된다", () => {
+      const { container } = render(() => (
+        <Link href="https://example.com" target="_blank">
+          링크
+        </Link>
+      ));
+      const link = container.firstChild as HTMLAnchorElement;
+      expect(link.getAttribute("target")).toBe("_blank");
+    });
+  });
+
+  describe("class merging", () => {
+    it("merges custom classes", () => {
+      /* eslint-disable tailwindcss/no-custom-classname */
+      const { container } = render(() => (
+        <Link href="#" class="my-link">
+          링크
+        </Link>
+      ));
+      /* eslint-enable tailwindcss/no-custom-classname */
+      const link = container.firstChild as HTMLElement;
+      expect(link.classList.contains("my-link")).toBe(true);
+    });
+  });
+
+  describe("HTML attribute forwarding", () => {
+    it("passes data-* attributes", () => {
+      const { container } = render(() => (
+        <Link href="#" data-testid="test-link">
+          링크
+        </Link>
+      ));
+      const link = container.firstChild as HTMLElement;
+      expect(link.getAttribute("data-testid")).toBe("test-link");
+    });
+  });
+});

package/tests/components/display/Tag.spec.tsx

@@ -0,0 +1,47 @@
+import { render } from "@solidjs/testing-library";
+import { describe, it, expect } from "vitest";
+import { Tag } from "../../../src/components/display/Tag";
+
+describe("Tag 컴포넌트", () => {
+  describe("basic rendering", () => {
+    it("children이 Tag 내부에 표시된다", () => {
+      const { getByText } = render(() => <Tag>New</Tag>);
+      expect(getByText("New")).toBeTruthy();
+    });
+
+    it("renders as span element", () => {
+      const { container } = render(() => <Tag>Tag</Tag>);
+      const tag = container.firstChild as HTMLElement;
+      expect(tag.tagName).toBe("SPAN");
+    });
+  });
+
+  describe("theme 속성", () => {
+    it("theme prop에 따라 스타일이 달라진다", () => {
+      const { container: defaultContainer } = render(() => <Tag>Tag</Tag>);
+      const { container: themedContainer } = render(() => <Tag theme="danger">Tag</Tag>);
+
+      const defaultClass = (defaultContainer.firstChild as HTMLElement).className;
+      const themedClass = (themedContainer.firstChild as HTMLElement).className;
+
+      expect(defaultClass).not.toBe(themedClass);
+    });
+  });
+
+  describe("class merging", () => {
+    it("merges custom classes", () => {
+      // eslint-disable-next-line tailwindcss/no-custom-classname
+      const { container } = render(() => <Tag class="my-tag">Tag</Tag>);
+      const tag = container.firstChild as HTMLElement;
+      expect(tag.classList.contains("my-tag")).toBe(true);
+    });
+  });
+
+  describe("HTML attribute forwarding", () => {
+    it("passes data-* attributes", () => {
+      const { container } = render(() => <Tag data-testid="test-tag">Tag</Tag>);
+      const tag = container.firstChild as HTMLElement;
+      expect(tag.getAttribute("data-testid")).toBe("test-tag");
+    });
+  });
+});

package/tests/components/features/address/AddressSearch.spec.tsx

@@ -0,0 +1,45 @@
+import { render, waitFor } from "@solidjs/testing-library";
+import { describe, it, expect } from "vitest";
+import { DialogProvider } from "../../../../src/components/disclosure/DialogProvider";
+import { useDialog } from "../../../../src/components/disclosure/DialogContext";
+import { AddressSearchContent } from "../../../../src/components/features/address/AddressSearch";
+
+function TestApp() {
+  const dialog = useDialog();
+
+  return (
+    <button
+      data-testid="open-btn"
+      onClick={() => {
+        void dialog.show(() => <AddressSearchContent />, {
+          header: "주소 검색",
+        });
+      }}
+    >
+      주소 검색 열기
+    </button>
+  );
+}
+
+describe("AddressSearchContent", () => {
+  it("마운트 시 Daum Postcode 위젯이 content 영역에 렌더된다", async () => {
+    const { getByTestId } = render(() => (
+      <DialogProvider>
+        <TestApp />
+      </DialogProvider>
+    ));
+
+    getByTestId("open-btn").click();
+
+    // Daum Postcode 스크립트 로드 + 위젯 embed 대기
+    await waitFor(
+      () => {
+        const content = document.querySelector("[data-address-content]");
+        expect(content).not.toBeNull();
+        // Daum Postcode 위젯이 embed되면 content 내부에 자식 요소가 생긴다
+        expect(content!.children.length).toBeGreaterThan(0);
+      },
+      { timeout: 10000 },
+    );
+  });
+});