feat(sync-help): SyncHelpModal 4 anchor 섹션 (메인 conflict / 자동 / silent / setup)

tests/unit/SyncHelpModal.test.tsx

@@ -0,0 +1,65 @@
+// @vitest-environment jsdom
+import { describe, it, expect, vi, beforeEach } from 'vitest';
+import '@testing-library/jest-dom/vitest';
+import { render, screen, fireEvent, cleanup } from '@testing-library/react';
+import React from 'react';
+import { SyncHelpModal } from '../../src/renderer/inbox/components/SyncHelpModal';
+
+describe('SyncHelpModal', () => {
+  beforeEach(() => {
+    cleanup();
+  });
+
+  it('4 섹션 헤더 렌더링', () => {
+    render(<SyncHelpModal onClose={() => {}} />);
+    expect(screen.getByRole('heading', { name: /충돌 해결/ })).toBeInTheDocument();
+    expect(screen.getByRole('heading', { name: /자동 처리/ })).toBeInTheDocument();
+    expect(screen.getByRole('heading', { name: /조용히 잘못될 수 있는/ })).toBeInTheDocument();
+    expect(screen.getByRole('heading', { name: /Setup/ })).toBeInTheDocument();
+  });
+
+  it('각 섹션이 anchor id 보유', () => {
+    const { container } = render(<SyncHelpModal onClose={() => {}} />);
+    expect(container.querySelector('#main-conflict')).not.toBeNull();
+    expect(container.querySelector('#auto')).not.toBeNull();
+    expect(container.querySelector('#silent')).not.toBeNull();
+    expect(container.querySelector('#setup')).not.toBeNull();
+  });
+
+  it('초기 anchor prop 으로 해당 섹션 scrollIntoView 호출', () => {
+    const scrollSpy = vi.fn();
+    Element.prototype.scrollIntoView = scrollSpy;
+    render(<SyncHelpModal onClose={() => {}} initialAnchor="main-conflict" />);
+    expect(scrollSpy).toHaveBeenCalled();
+  });
+
+  it('X 버튼 클릭 → onClose 호출', () => {
+    const onClose = vi.fn();
+    render(<SyncHelpModal onClose={onClose} />);
+    fireEvent.click(screen.getByRole('button', { name: /닫기/ }));
+    expect(onClose).toHaveBeenCalled();
+  });
+
+  it('overlay 클릭 → onClose 호출', () => {
+    const onClose = vi.fn();
+    const { container } = render(<SyncHelpModal onClose={onClose} />);
+    const overlay = container.firstChild as HTMLElement;
+    fireEvent.click(overlay);
+    expect(onClose).toHaveBeenCalled();
+  });
+
+  it('modal body 클릭 → onClose 호출 X (stopPropagation)', () => {
+    const onClose = vi.fn();
+    render(<SyncHelpModal onClose={onClose} />);
+    fireEvent.click(screen.getByRole('heading', { name: /충돌 해결/ }));
+    expect(onClose).not.toHaveBeenCalled();
+  });
+
+  it('주요 시나리오 키워드 본문 포함 (회귀)', () => {
+    render(<SyncHelpModal onClose={() => {}} />);
+    expect(screen.getByText(/편집\/편집/)).toBeInTheDocument();
+    expect(screen.getByText(/삭제\/편집/)).toBeInTheDocument();
+    expect(screen.getByText(/AI 결과 충돌/)).toBeInTheDocument();
+    expect(screen.getByText(/git@https:\/\//)).toBeInTheDocument();
+  });
+});