docs: 프롬프트 템플릿에 대한 리드미 파일 수정

ongheong · ongheong · commit e9d95dcb61f1 · 2025-10-15T13:15:39.000+09:00
diff --git a/.cursor/templates/README.md b/.cursor/templates/README.md
@@ -1,49 +1,45 @@
-# Cursor AI 도구 모음
+# Cursor AI 테스트 생성 도구
 
-이 디렉토리는 Cursor AI를 활용한 개발 도구들을 모아놓은 곳입니다.
+이 디렉토리는 Cursor AI를 활용하여 **Githru VSCode Extension** 프로젝트의 테스트 코드를 자동 생성하는 도구들을 모아놓은 곳입니다.
 
-## 📁 구조
+## 📁 프로젝트 구조
 
 ```
-.cursor/
-├── rules/                    # Cursor 룰 파일들
-│   └── testing.mdc          # 테스트 관련 룰
-├── templates/               # AI 프롬프트 템플릿들
-│   ├── test.playwright.md   # E2E 테스트 생성 템플릿
-│   ├── test.unit.md         # Unit 테스트 생성 템플릿
-│   ├── test.integration.md  # 통합 테스트 생성 템플릿
-│   └── README.md           # 이 파일
-└── generated-tests/         # 템플릿으로 생성된 테스트들
-    ├── e2e/                # E2E 테스트
-    ├── unit/               # 단위 테스트
-    └── integration/        # 통합 테스트
+githru-vscode-ext/
+├── .cursor/                          # Cursor AI 도구들
+│   ├── rules/
+│   │   └── testing.mdc              # 테스트 작성 규칙
+│   └── templates/
+│       ├── test.playwright.md       # E2E 테스트 템플릿
+│       └── README.md               # 이 파일
+├── packages/
+│   ├── view/                        # React 웹뷰 패키지
+│   │   ├── src/
+│   │   │   ├── components/          # React 컴포넌트들
+│   │   │   ├── store/              # Zustand 상태 관리
+│   │   │   └── fake-assets/        # 테스트용 모킹 데이터
+│   │   └── tests/                  # 실제 테스트 파일들
+│   │       ├── pr-commit-detail.e2e.spec.ts
+│   │       ├── temporal-filter.e2e.spec.ts
+│   │       └── fakeAsset.ts        # 테스트 헬퍼 함수들
+│   ├── analysis-engine/             # 분석 엔진 패키지
+│   └── vscode/                      # VSCode 확장 패키지
 ```
 
-## 🚀 사용 방법
+## 🚀 빠른 시작 (Quick Start)
 
-### 1. E2E 테스트 생성
+### 1. E2E 테스트 생성 (Playwright)
 
-1. 템플릿 파일을 열어서 테스트 시나리오를 작성합니다
-2. Cursor Agent (⌃+I)에 붙여넣습니다
-3. AI가 자동으로 `.cursor/generated-tests/e2e/` 디렉토리에 파일을 생성하고 저장합니다
+**템플릿 파일**: `.cursor/templates/test.playwright.md`
 
-### 2. Unit 테스트 생성
+1. **템플릿 열기**: `.cursor/templates/test.playwright.md` 파일을 엽니다
+2. **시나리오 작성**: 아래 예시를 참고해 테스트 시나리오를 작성합니다
+3. **AI 실행**: `⌃+I` (Cursor Agent)를 누르고 템플릿을 붙여넣습니다
+4. **파일 생성**: AI가 자동으로 `packages/view/tests/`에 테스트 파일을 생성합니다
 
-**템플릿 파일**: `templates/test.unit.md`
+## 📝 사용 예시
 
-1. 템플릿 파일을 열어서 테스트 시나리오를 작성합니다
-2. Cursor Agent (⌃+I)에 붙여넣습니다
-3. AI가 자동으로 `.cursor/generated-tests/unit/` 디렉토리에 파일을 생성하고 저장합니다
-
-### 3. 통합 테스트 생성
-
-**템플릿 파일**: `templates/test.integration.md`
-
-1. 템플릿 파일을 열어서 테스트 시나리오를 작성합니다
-2. Cursor Agent (⌃+I)에 붙여넣습니다
-3. AI가 자동으로 `.cursor/generated-tests/integration/` 디렉토리에 파일을 생성하고 저장합니다
-
-**예시**:
+### E2E 테스트 예시 (TemporalFilter)
 
 ```markdown
 Context:
@@ -61,132 +57,83 @@ Constraints:
 - VSCode webview environment
 ```
 
-**BranchSelector 예시**:
-
-```markdown
-Context:
+**결과**: `packages/view/tests/temporal-filter.e2e.spec.ts` 파일 생성
 
-- 테스트 대상: BranchSelector 컴포넌트
-- 시나리오:
-  - [ ] 브랜치 목록이 로드되어야 한다
-  - [ ] 브랜치 선택 시 데이터가 갱신되어야 한다
-  - [ ] 로딩 중에는 스피너가 표시되어야 한다
-
-Constraints:
-
-- Zustand state only (no other state libs)
-- Mock external dependencies (GitHub API, file system)
-- VSCode webview environment
-```
+## 🔧 테스트 룰 및 규칙
 
-### 2. 테스트 룰 적용
+### 자동 적용되는 룰
 
-**룰 파일**: `rules/testing.mdc`
+**룰 파일**: `.cursor/rules/testing.mdc`
 
 - Cursor가 자동으로 이 룰을 적용하여 일관된 테스트 코드를 생성합니다
-- Jest + RTL + Playwright 패턴을 따릅니다
-- VSCode webview 환경에 최적화되어 있습니다
-
-## 📋 생성된 테스트 관리
+- **Jest + RTL + Playwright** 패턴을 따릅니다
+- **VSCode webview 환경**에 최적화되어 있습니다
+- **Zustand 상태 관리**와 **외부 의존성 모킹**을 자동으로 처리합니다
 
 ### 파일 명명 규칙
 
-- E2E 테스트: `{component-name}.e2e.spec.ts`
-- 단위 테스트: `{component-name}.test.tsx`
-- 통합 테스트: `{component-name}.spec.tsx`
+- **E2E 테스트**: `{component-name}.e2e.spec.ts`
 
-### 디렉토리 구조
+### 실제 테스트 파일 위치
 
 ```
-packages/view/tests/          # 실제 테스트 파일 위치
-├── branch-selector.e2e.spec.ts      # ✅ 완료된 BranchSelector E2E 테스트
-├── temporal-filter-working.e2e.spec.ts  # ✅ 완료된 TemporalFilter E2E 테스트
-└── branch-selector.e2e.spec copy.ts     # 기존 테스트 백업
-
-.cursor/generated-tests/      # 템플릿으로 생성된 테스트들 (참고용)
-├── e2e/                     # E2E 테스트들
-│   ├── temporal-filter.e2e.spec.ts
-│   └── branch-selector.e2e.spec.ts
-├── unit/                    # 단위 테스트들
-│   ├── statistics.test.tsx
-│   └── theme-selector.test.tsx
-└── integration/             # 통합 테스트들
-    └── webview-communication.spec.ts
+packages/view/tests/
 ```
 
-### ✅ 완료된 테스트 현황
-
-#### BranchSelector E2E 테스트 (`branch-selector.e2e.spec.ts`)
-
-- **테스트 시나리오**: 5개 (4개 통과, 1개 스킵)
-  1. ✅ 브랜치 목록이 로드되어야 한다
-  2. ✅ 브랜치 선택 시 데이터가 갱신되어야 한다
-  3. ✅ 로딩 중에는 스피너가 표시되어야 한다
-  4. ✅ 브랜치 선택 시 IDE 메시지가 전송되어야 한다
-  5. ⏭️ 브랜치 목록이 비어있을 때 적절한 처리가 되어야 한다 (스킵)
-
-#### TemporalFilter E2E 테스트 (`temporal-filter-working.e2e.spec.ts`)
-
-- **테스트 시나리오**: 2개 (모두 통과)
-  1. ✅ 기간 브러시 필터링이 정상 작동해야 한다
-  2. ✅ 브러시 필터링 후 통계가 갱신되어야 한다
-
-## 🔧 커스터마이징
-
-### 새로운 템플릿 추가
-
-1. `templates/` 디렉토리에 새 `.md` 파일 생성
-2. 프롬프트 템플릿 작성
-3. 이 README에 사용법 추가
-
-### 룰 수정
-
-1. `rules/testing.mdc` 파일 편집
-2. 프로젝트 요구사항에 맞게 가이드라인 조정
-
-## 📚 참고 자료
-
-- [Cursor 공식 문서](https://cursor.sh/docs)
-- [Playwright 테스트 가이드](https://playwright.dev/docs/intro)
-- [Jest + RTL 가이드](https://testing-library.com/docs/react-testing-library/intro/)
-- [Zustand 테스트 패턴](https://github.com/pmndrs/zustand/blob/main/docs/guides/testing.md)
-
 ## 🎯 테스트 실행 방법
 
 ### E2E 테스트 실행
 
 ```bash
-# 특정 컴포넌트 테스트 실행
-npm run test:e2e -- --grep "BranchSelector"
+# packages/view 디렉토리로 이동
+cd packages/view
 
 # 모든 E2E 테스트 실행
 npm run test:e2e
 
-# 테스트 리포트 확인
-npx playwright show-report
+# 특정 테스트 실행
+npm run test:e2e -- tests/pr-commit-detail.e2e.spec.ts
+npm run test:e2e -- tests/temporal-filter.e2e.spec.ts
+
+# 특정 브라우저에서 실행
+npm run test:e2e -- --project=chromium
+npm run test:e2e -- --project=webkit
 ```
 
 ### 테스트 결과 확인
 
 ```bash
-# 마지막 실행 결과 확인
+# 테스트 리포트 확인
 npx playwright show-report
 
-# 특정 브라우저에서 테스트 실행
-npx playwright test --project=chromium
+# 헤드리스 모드로 실행
+npm run test:e2e -- --headed
+
+# 디버그 모드로 실행
+npm run test:e2e -- --debug
 ```
 
-## ⚠️ 주의사항
+## 🔧 커스터마이징
+
+### 새로운 템플릿 추가
+
+1. `.cursor/templates/` 디렉토리에 새 `.md` 파일 생성
+2. 프롬프트 템플릿 작성
+3. 이 README에 사용법 추가
 
-- 생성된 테스트는 반드시 실제 실행해보고 검증하세요
-- 프로젝트별 특성에 맞게 셀렉터와 로직을 조정하세요
-- VSCode webview 환경의 제약사항을 고려하세요
-- 로딩 상태가 너무 빠를 경우 스피너 테스트가 스킵될 수 있습니다
-- 브랜치 목록이 1개만 있을 경우 선택 테스트가 스킵됩니다
+**현재 사용 가능한 템플릿**:
 
-## 🚀 다음 단계
+- `test.playwright.md`: E2E 테스트 생성용
+
+### 룰 수정
+
+1. `.cursor/rules/testing.mdc` 파일 편집
+2. 프로젝트 요구사항에 맞게 가이드라인 조정
+
+## ⚠️ 주의사항
 
-1. **Unit 테스트 추가**: BranchSelector 컴포넌트의 개별 함수들에 대한 단위 테스트
-2. **Integration 테스트**: VSCode webview와의 통신 테스트
-3. **다른 컴포넌트 테스트**: Statistics, ThemeSelector 등 추가 컴포넌트 테스트
-4. **CI/CD 통합**: GitHub Actions에서 자동 테스트 실행 설정
+- **생성된 테스트는 반드시 실제 실행해보고 검증하세요**
+- **VSCode webview 환경의 제약사항**을 고려하세요
+- **Zustand 상태 관리**와 **외부 의존성 모킹**이 자동으로 적용됩니다
+- **로딩 상태가 너무 빠를 경우** 스피너 테스트가 스킵될 수 있습니다
+- **실제 DOM 구조**에 맞춰 셀렉터가 자동으로 조정됩니다
