Chore/#5 Vitest 설정 파일 및 테스트 환경(setup) 추가#6
Conversation
Walkthrough이 변경 사항은 Vitest 기반 테스트 환경을 프로젝트에 도입합니다. 웹 앱의 유틸리티 함수에 대한 샘플 테스트와 함께, Vitest 및 Testing Library 관련 의존성, 테스트 스크립트, tsconfig 및 터보 레포 설정이 추가되었습니다. 또한, GitHub Actions 워크플로와 테스트 환경 설정 파일도 포함되어 있습니다. Changes
Sequence Diagram(s)sequenceDiagram
participant GitHub PR
participant Actions Runner
participant Node.js Env
participant pnpm
participant Vitest
GitHub PR->>Actions Runner: PR에서 *.spec.ts 변경 감지
Actions Runner->>Node.js Env: Ubuntu 환경 준비
Actions Runner->>pnpm: 의존성 설치 (pnpm install)
Actions Runner->>Vitest: pnpm test 실행
Vitest-->>Actions Runner: 테스트 결과 반환
Estimated code review effort🎯 2 (Simple) | ⏱️ ~8 minutes Poem
Note ⚡️ Unit Test Generation is now available in beta!Learn more here, or try it out under "Finishing Touches" below. ✨ Finishing Touches
🧪 Generate unit tests
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
apps/web/app/_utils/sum/sum.spec.ts (1)
1-6: Vitest 테스트가 올바르게 구성되었습니다.기본적인 테스트 케이스로 Vitest 설정을 검증하기에 적합합니다. 추후 실제 프로덕션 코드를 위해 엣지 케이스나 에러 케이스를 포함한 더 포괄적인 테스트 예제를 고려해보세요.
.github/workflows/vitest.yml (1)
1-23: GitHub Actions 워크플로우가 적절히 구성되었습니다.테스트 파일 변경 시에만 트리거되도록 설정된 점과
--frozen-lockfile사용은 좋은 practice입니다. 추후 다른 테스트 파일 확장자(.test.ts,.test.tsx등)도 고려해볼 수 있습니다.paths: - - "**/*.spec.ts" + - "**/*.spec.ts" + - "**/*.test.ts" + - "**/*.spec.tsx" + - "**/*.test.tsx"
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (9)
.github/workflows/vitest.yml(1 hunks)apps/web/app/_utils/sum/sum.spec.ts(1 hunks)apps/web/app/_utils/sum/sum.ts(1 hunks)apps/web/package.json(2 hunks)apps/web/tsconfig.json(1 hunks)apps/web/vitest.config.ts(1 hunks)apps/web/vitest.setup.ts(1 hunks)package.json(1 hunks)turbo.json(1 hunks)
🔇 Additional comments (11)
apps/web/app/_utils/sum/sum.ts (1)
1-4: 테스트용 유틸리티 함수가 올바르게 구현되었습니다.간단한 덧셈 함수로 Vitest 설정을 검증하기에 적합합니다. 테스트 완료 후 삭제 예정이라고 명시된 점도 좋습니다.
package.json (1)
9-11: 테스트 스크립트가 올바르게 추가되었습니다.Turbo 기반 모노레포 환경에 적합한 구성으로, 기존 스크립트 패턴과 일관성을 유지하고 있습니다.
turbo.json (1)
21-27: Turbo 테스트 태스크 설정이 올바르게 구성되었습니다.의존성 관리(
^test)와 watch 모드 설정이 적절하며, 기존dev태스크와 일관된 패턴을 따르고 있습니다.apps/web/vitest.config.ts (1)
1-12: Vitest 설정이 잘 구성되어 있습니다.React 컴포넌트 테스팅을 위한 적절한 설정이 포함되어 있습니다:
- jsdom 환경으로 DOM 시뮬레이션 지원
- TypeScript 경로 별칭 해결
- 전역 테스트 API 활성화
- 테스트 셋업 파일 지정
apps/web/tsconfig.json (3)
9-9: Vitest 타입 정의가 적절히 추가되었습니다.
vitest/globals와vitest/jsdom타입이 추가되어 전역 테스트 API와 DOM 환경에 대한 타입 지원이 제공됩니다.
11-14: 경로 별칭 설정이 올바르게 구성되었습니다.
@/*별칭이src/*에 매핑되어 있어 vitest.config.ts의tsconfigPaths플러그인과 일치합니다.
22-23: Vitest 관련 파일이 include에 적절히 포함되었습니다.
vitest.config.ts와vitest.setup.ts파일이 TypeScript 컴파일 대상에 포함되어 타입 체킹이 가능합니다.apps/web/vitest.setup.ts (2)
1-1: Jest-DOM 매처가 Vitest용으로 올바르게 import되었습니다.
@testing-library/jest-dom/vitest에서 import하여 Vitest와의 호환성을 보장합니다.
3-16: matchMedia 모킹이 적절히 구현되었습니다.GitHub 이슈 참조와 함께 완전한 matchMedia API 모킹이 제공되어 미디어 쿼리를 사용하는 컴포넌트 테스트가 가능합니다. 모든 필수 속성과 메서드가 포함되어 있습니다.
apps/web/package.json (2)
12-13: 테스트 스크립트가 적절히 추가되었습니다.
test와test:watch명령어가 Vitest를 사용하도록 올바르게 구성되었습니다.
32-47: 테스팅 관련 의존성이 잘 구성되었습니다.React 컴포넌트 테스팅에 필요한 모든 패키지가 포함되어 있습니다:
- Testing Library 패키지들 (DOM, React, Jest-DOM, User-Event)
- Vitest와 jsdom
- Vite 플러그인들 (React, TypeScript 경로 해결)
버전들이 최신이고 서로 호환됩니다.
1 participant
#️⃣연관된 이슈
📝작업 내용
스크린샷 (선택)
💬리뷰 요구사항(선택)
Summary by CodeRabbit
New Features
Chores