@mandujs/mcp 0.12.2 → 0.13.0

package/src/resources/skills/mandu-testing/rules/_sections.md

@@ -1,26 +1,26 @@
-# Sections
-
-This file defines all sections, their ordering, impact levels, and descriptions.
-The section ID (in parentheses) is the filename prefix used to group rules.
-
----
-
-## 1. Slot Testing (test-slot)
-
-**Impact:** HIGH
-**Description:** slot 핸들러의 단위 테스트와 통합 테스트. API 로직의 정확성 검증에 필수입니다.
-
-## 2. Component Testing (test-component)
-
-**Impact:** HIGH
-**Description:** Island 컴포넌트의 렌더링과 인터랙션 테스트. UI 로직의 정확성 검증입니다.
-
-## 3. E2E Testing (test-e2e)
-
-**Impact:** MEDIUM
-**Description:** Playwright를 사용한 End-to-End 테스트. 전체 사용자 플로우 검증입니다.
-
-## 4. Mocking (test-mock)
-
-**Impact:** MEDIUM
-**Description:** 외부 의존성 모킹. 테스트 격리와 속도 향상을 위한 기법입니다.
+# Sections
+
+This file defines all sections, their ordering, impact levels, and descriptions.
+The section ID (in parentheses) is the filename prefix used to group rules.
+
+---
+
+## 1. Slot Testing (test-slot)
+
+**Impact:** HIGH
+**Description:** slot 핸들러의 단위 테스트와 통합 테스트. API 로직의 정확성 검증에 필수입니다.
+
+## 2. Component Testing (test-component)
+
+**Impact:** HIGH
+**Description:** Island 컴포넌트의 렌더링과 인터랙션 테스트. UI 로직의 정확성 검증입니다.
+
+## 3. E2E Testing (test-e2e)
+
+**Impact:** MEDIUM
+**Description:** Playwright를 사용한 End-to-End 테스트. 전체 사용자 플로우 검증입니다.
+
+## 4. Mocking (test-mock)
+
+**Impact:** MEDIUM
+**Description:** 외부 의존성 모킹. 테스트 격리와 속도 향상을 위한 기법입니다.

package/src/resources/skills/mandu-testing/rules/_template.md

@@ -1,65 +1,65 @@
-# Rule Template
-
-Use this template when creating new rules for mandu-testing.
-
----
-
-```markdown
----
-title: Rule Title Here
-impact: HIGH | MEDIUM | LOW
-impactDescription: 영향 설명 (예: "Ensures API correctness")
-tags: testing, tag1, tag2
----
-
-## Rule Title Here
-
-**Impact: {LEVEL} ({impactDescription})**
-
-테스트 규칙의 목적과 중요성을 설명합니다.
-
-**Test Example:**
-
-\`\`\`typescript
-import { describe, it, expect } from "bun:test";
-import userSlot from "./user.slot";
-
-describe("User Slot", () => {
-  it("should return user by id", async () => {
-    const ctx = createMockContext({
-      params: { id: "1" },
-    });
-
-    const response = await userSlot.handlers.get(ctx);
-
-    expect(response.status).toBe(200);
-    expect(response.body.user.id).toBe("1");
-  });
-});
-\`\`\`
-
-## Test Structure
-
-테스트 구조와 네이밍 컨벤션을 설명합니다.
-
-## Common Patterns
-
-자주 사용되는 테스트 패턴을 설명합니다.
-
-Reference: [Bun Test Docs](https://bun.sh/docs/cli/test)
-```
-
----
-
-## Naming Convention
-
-- 파일명: `test-{category}-{rule-name}.md`
-- 예시: `test-slot-unit.md`, `test-e2e-playwright.md`
-
-## Test File Location
-
-| Type | Location | Pattern |
-|------|----------|---------|
-| Slot Unit | `spec/slots/*.test.ts` | Co-located |
-| Component | `app/**/*.test.tsx` | Co-located |
-| E2E | `tests/e2e/*.spec.ts` | Centralized |
+# Rule Template
+
+Use this template when creating new rules for mandu-testing.
+
+---
+
+```markdown
+---
+title: Rule Title Here
+impact: HIGH | MEDIUM | LOW
+impactDescription: 영향 설명 (예: "Ensures API correctness")
+tags: testing, tag1, tag2
+---
+
+## Rule Title Here
+
+**Impact: {LEVEL} ({impactDescription})**
+
+테스트 규칙의 목적과 중요성을 설명합니다.
+
+**Test Example:**
+
+\`\`\`typescript
+import { describe, it, expect } from "bun:test";
+import userSlot from "./user.slot";
+
+describe("User Slot", () => {
+  it("should return user by id", async () => {
+    const ctx = createMockContext({
+      params: { id: "1" },
+    });
+
+    const response = await userSlot.handlers.get(ctx);
+
+    expect(response.status).toBe(200);
+    expect(response.body.user.id).toBe("1");
+  });
+});
+\`\`\`
+
+## Test Structure
+
+테스트 구조와 네이밍 컨벤션을 설명합니다.
+
+## Common Patterns
+
+자주 사용되는 테스트 패턴을 설명합니다.
+
+Reference: [Bun Test Docs](https://bun.sh/docs/cli/test)
+```
+
+---
+
+## Naming Convention
+
+- 파일명: `test-{category}-{rule-name}.md`
+- 예시: `test-slot-unit.md`, `test-e2e-playwright.md`
+
+## Test File Location
+
+| Type | Location | Pattern |
+|------|----------|---------|
+| Slot Unit | `spec/slots/*.test.ts` | Co-located |
+| Component | `app/**/*.test.tsx` | Co-located |
+| E2E | `tests/e2e/*.spec.ts` | Centralized |

package/src/resources/skills/mandu-testing/rules/test-component-island.md

@@ -1,195 +1,195 @@
----
-title: Test Island Components
-impact: HIGH
-impactDescription: Ensures UI correctness
-tags: testing, component, island, react
----
-
-## Test Island Components
-
-**Impact: HIGH (Ensures UI correctness)**
-
-Island 컴포넌트의 렌더링과 인터랙션을 테스트하세요.
-
-**기본 컴포넌트 테스트:**
-
-```typescript
-// app/counter/client.test.tsx
-import { describe, it, expect } from "bun:test";
-import { render, screen, fireEvent } from "@testing-library/react";
-import { CounterIsland } from "./client";
-
-describe("CounterIsland", () => {
-  it("should render initial count", () => {
-    render(<CounterIsland initial={5} />);
-
-    expect(screen.getByText("Count: 5")).toBeDefined();
-  });
-
-  it("should increment on button click", async () => {
-    render(<CounterIsland initial={0} />);
-
-    const button = screen.getByRole("button", { name: /increment/i });
-    fireEvent.click(button);
-
-    expect(screen.getByText("Count: 1")).toBeDefined();
-  });
-
-  it("should decrement on button click", async () => {
-    render(<CounterIsland initial={10} />);
-
-    const button = screen.getByRole("button", { name: /decrement/i });
-    fireEvent.click(button);
-
-    expect(screen.getByText("Count: 9")).toBeDefined();
-  });
-});
-```
-
-## 비동기 동작 테스트
-
-```typescript
-// app/search/client.test.tsx
-import { describe, it, expect, mock } from "bun:test";
-import { render, screen, fireEvent, waitFor } from "@testing-library/react";
-import { SearchIsland } from "./client";
-
-// fetch 모킹
-global.fetch = mock(() =>
-  Promise.resolve({
-    ok: true,
-    json: () => Promise.resolve({ results: [{ id: 1, name: "Test" }] }),
-  })
-);
-
-describe("SearchIsland", () => {
-  it("should fetch and display results", async () => {
-    render(<SearchIsland />);
-
-    const input = screen.getByPlaceholderText("Search...");
-    fireEvent.change(input, { target: { value: "test" } });
-
-    // 비동기 결과 대기
-    await waitFor(() => {
-      expect(screen.getByText("Test")).toBeDefined();
-    });
-  });
-
-  it("should show loading state", async () => {
-    render(<SearchIsland />);
-
-    const input = screen.getByPlaceholderText("Search...");
-    fireEvent.change(input, { target: { value: "test" } });
-
-    // 로딩 상태 확인
-    expect(screen.getByText("Loading...")).toBeDefined();
-  });
-});
-```
-
-## 컴파운드 Island 테스트
-
-```typescript
-// app/form/client.test.tsx
-import { describe, it, expect } from "bun:test";
-import { render, screen, fireEvent } from "@testing-library/react";
-import { Form } from "./client";
-
-describe("Form Island", () => {
-  it("should submit form data", async () => {
-    const onSubmit = mock(() => {});
-
-    render(
-      <Form.Provider onSubmit={onSubmit}>
-        <Form.Frame>
-          <Form.Input name="email" />
-          <Form.Submit>Submit</Form.Submit>
-        </Form.Frame>
-      </Form.Provider>
-    );
-
-    const input = screen.getByRole("textbox");
-    fireEvent.change(input, { target: { value: "test@example.com" } });
-
-    const button = screen.getByRole("button", { name: /submit/i });
-    fireEvent.click(button);
-
-    expect(onSubmit).toHaveBeenCalledWith({
-      email: "test@example.com",
-    });
-  });
-});
-```
-
-## useIslandEvent 테스트
-
-```typescript
-import { describe, it, expect } from "bun:test";
-import { render, screen, fireEvent } from "@testing-library/react";
-import { renderHook, act } from "@testing-library/react";
-import { useIslandEvent } from "@mandujs/core/client";
-
-describe("useIslandEvent", () => {
-  it("should emit and receive events", () => {
-    const received: number[] = [];
-
-    // 리스너 설정
-    const { result: listener } = renderHook(() =>
-      useIslandEvent<{ count: number }>("test-event", (data) => {
-        received.push(data.count);
-      })
-    );
-
-    // 이벤트 발송
-    const { result: emitter } = renderHook(() =>
-      useIslandEvent<{ count: number }>("test-event")
-    );
-
-    act(() => {
-      emitter.current.emit({ count: 42 });
-    });
-
-    expect(received).toContain(42);
-  });
-});
-```
-
-## 스냅샷 테스트
-
-```typescript
-import { describe, it, expect } from "bun:test";
-import { render } from "@testing-library/react";
-import { CardIsland } from "./client";
-
-describe("CardIsland", () => {
-  it("should match snapshot", () => {
-    const { container } = render(
-      <CardIsland title="Test" description="Description" />
-    );
-
-    expect(container.innerHTML).toMatchSnapshot();
-  });
-});
-```
-
-## 테스트 설정
-
-```typescript
-// test/setup.ts
-import "@testing-library/jest-dom";
-import { cleanup } from "@testing-library/react";
-import { afterEach } from "bun:test";
-
-// 각 테스트 후 정리
-afterEach(() => {
-  cleanup();
-});
-```
-
-```json
-// bunfig.toml
-[test]
-preload = ["./test/setup.ts"]
-```
-
-Reference: [Testing Library React](https://testing-library.com/docs/react-testing-library/intro)
+---
+title: Test Island Components
+impact: HIGH
+impactDescription: Ensures UI correctness
+tags: testing, component, island, react
+---
+
+## Test Island Components
+
+**Impact: HIGH (Ensures UI correctness)**
+
+Island 컴포넌트의 렌더링과 인터랙션을 테스트하세요.
+
+**기본 컴포넌트 테스트:**
+
+```typescript
+// app/counter/client.test.tsx
+import { describe, it, expect } from "bun:test";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { CounterIsland } from "./client";
+
+describe("CounterIsland", () => {
+  it("should render initial count", () => {
+    render(<CounterIsland initial={5} />);
+
+    expect(screen.getByText("Count: 5")).toBeDefined();
+  });
+
+  it("should increment on button click", async () => {
+    render(<CounterIsland initial={0} />);
+
+    const button = screen.getByRole("button", { name: /increment/i });
+    fireEvent.click(button);
+
+    expect(screen.getByText("Count: 1")).toBeDefined();
+  });
+
+  it("should decrement on button click", async () => {
+    render(<CounterIsland initial={10} />);
+
+    const button = screen.getByRole("button", { name: /decrement/i });
+    fireEvent.click(button);
+
+    expect(screen.getByText("Count: 9")).toBeDefined();
+  });
+});
+```
+
+## 비동기 동작 테스트
+
+```typescript
+// app/search/client.test.tsx
+import { describe, it, expect, mock } from "bun:test";
+import { render, screen, fireEvent, waitFor } from "@testing-library/react";
+import { SearchIsland } from "./client";
+
+// fetch 모킹
+global.fetch = mock(() =>
+  Promise.resolve({
+    ok: true,
+    json: () => Promise.resolve({ results: [{ id: 1, name: "Test" }] }),
+  })
+);
+
+describe("SearchIsland", () => {
+  it("should fetch and display results", async () => {
+    render(<SearchIsland />);
+
+    const input = screen.getByPlaceholderText("Search...");
+    fireEvent.change(input, { target: { value: "test" } });
+
+    // 비동기 결과 대기
+    await waitFor(() => {
+      expect(screen.getByText("Test")).toBeDefined();
+    });
+  });
+
+  it("should show loading state", async () => {
+    render(<SearchIsland />);
+
+    const input = screen.getByPlaceholderText("Search...");
+    fireEvent.change(input, { target: { value: "test" } });
+
+    // 로딩 상태 확인
+    expect(screen.getByText("Loading...")).toBeDefined();
+  });
+});
+```
+
+## 컴파운드 Island 테스트
+
+```typescript
+// app/form/client.test.tsx
+import { describe, it, expect } from "bun:test";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { Form } from "./client";
+
+describe("Form Island", () => {
+  it("should submit form data", async () => {
+    const onSubmit = mock(() => {});
+
+    render(
+      <Form.Provider onSubmit={onSubmit}>
+        <Form.Frame>
+          <Form.Input name="email" />
+          <Form.Submit>Submit</Form.Submit>
+        </Form.Frame>
+      </Form.Provider>
+    );
+
+    const input = screen.getByRole("textbox");
+    fireEvent.change(input, { target: { value: "test@example.com" } });
+
+    const button = screen.getByRole("button", { name: /submit/i });
+    fireEvent.click(button);
+
+    expect(onSubmit).toHaveBeenCalledWith({
+      email: "test@example.com",
+    });
+  });
+});
+```
+
+## useIslandEvent 테스트
+
+```typescript
+import { describe, it, expect } from "bun:test";
+import { render, screen, fireEvent } from "@testing-library/react";
+import { renderHook, act } from "@testing-library/react";
+import { useIslandEvent } from "@mandujs/core/client";
+
+describe("useIslandEvent", () => {
+  it("should emit and receive events", () => {
+    const received: number[] = [];
+
+    // 리스너 설정
+    const { result: listener } = renderHook(() =>
+      useIslandEvent<{ count: number }>("test-event", (data) => {
+        received.push(data.count);
+      })
+    );
+
+    // 이벤트 발송
+    const { result: emitter } = renderHook(() =>
+      useIslandEvent<{ count: number }>("test-event")
+    );
+
+    act(() => {
+      emitter.current.emit({ count: 42 });
+    });
+
+    expect(received).toContain(42);
+  });
+});
+```
+
+## 스냅샷 테스트
+
+```typescript
+import { describe, it, expect } from "bun:test";
+import { render } from "@testing-library/react";
+import { CardIsland } from "./client";
+
+describe("CardIsland", () => {
+  it("should match snapshot", () => {
+    const { container } = render(
+      <CardIsland title="Test" description="Description" />
+    );
+
+    expect(container.innerHTML).toMatchSnapshot();
+  });
+});
+```
+
+## 테스트 설정
+
+```typescript
+// test/setup.ts
+import "@testing-library/jest-dom";
+import { cleanup } from "@testing-library/react";
+import { afterEach } from "bun:test";
+
+// 각 테스트 후 정리
+afterEach(() => {
+  cleanup();
+});
+```
+
+```json
+// bunfig.toml
+[test]
+preload = ["./test/setup.ts"]
+```
+
+Reference: [Testing Library React](https://testing-library.com/docs/react-testing-library/intro)