Conversation
기존 유닛테스트는 Prisma를 전부 mock 처리해서 실제 DB 제약(unique, 트랜잭션)과 동시성 상황은 검증하지 못했다. 실제 Postgres 테스트 DB에 붙는 통합테스트 계층을 새로 만들고, 동시 요청에서도 주문번호 중복이 안 생기는지·입금기한 만료 자동취소가 정확히 한 번만 처리되는지·구글 회원가입 시 googleId 유니크 제약이 실제로 지켜지는지를 검증한다. CI(test-backend.yml)에도 Postgres 서비스 컨테이너를 추가해 PR마다 자동 실행되게 한다. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Au6qVAM3RXf7rAakifYDcL
DB 통합테스트는 컨트롤러/가드/전역 파이프를 거치지 않고 서비스 클래스를 직접 호출해서, 인증 가드·요청 검증·응답 인터셉터를 포함한 전체 HTTP 파이프라인은 검증하지 못했다. AppModule을 통째로 띄워 실제 HTTP 요청으로 인증(JWT 가드) → 주문 생성 → DB 저장까지 이어지는 경로를 supertest로 검증한다. NotificationOrderDispatchService만 no-op으로 교체해 테스트 중 실제 Firebase 푸시·카카오 알림톡이 나가지 않게 했다. CI에서는 AppModule 부팅에 필요한 (하지만 이 골든패스에서 실제로 호출되지는 않는) 필수 환경변수에 더미 값을 채워 넣었다 — 로컬에서 값을 하나씩 빼보며 어떤 게 진짜 필수인지 확인했다. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Au6qVAM3RXf7rAakifYDcL
vitest.config.ts에 순수 로직용 "unit" 프로젝트를 추가하고(브라우저 기반 storybook 프로젝트와 분리), 지금까지 0%였던 상품 가격 계산·재고 검증·JWT 디코딩 유틸 함수에 첫 유닛테스트를 작성했다. 백엔드(test-backend.yml)에만 있던 PR 게이트를 프론트엔드에도 만든다. web-user/web-seller/web-admin 매트릭스로 구성해, package.json에 test 스크립트가 있고 실제로 변경된 앱만 돌게 했다 — web-seller/web-admin은 아직 테스트가 없어 지금은 자동으로 건너뛰지만, 나중에 test 스크립트를 추가하면 워크플로우 수정 없이 바로 게이트에 편입된다. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Au6qVAM3RXf7rAakifYDcL
addon-vitest(브라우저 기반 storybook 테스트)를 실제로 처음 돌려보니
Icon.stories.tsx가 전부 깨져 있었다: "Element type is invalid". 원인을 추적한
결과 실제 프로덕션 Storybook 빌드에서도 동일하게 재현되는 진짜 버그였다 —
@storybook/nextjs-vite의 Next Image 처리가 기본적으로 "*.svg?react"만 SVGR에
양보하는데, 이 프로젝트는 next.config.js의 @svgr/webpack 규칙 때문에 쿼리
스트링 없는 일반 .svg도 전부 컴포넌트로 import한다. 그래서 Icon의 모든 아이콘이
React 컴포넌트가 아니라 Next Image 객체({width,height})로 잘못 해석되고 있었다.
.storybook/main.ts에 framework.options.image.excludeFiles를 추가해 SVGR이
우선하도록 고쳤다(빌드 산출물을 직접 열어 실제로 함수형 컴포넌트로 바뀌는지
확인). 이 버그는 지금까지 아무도 자동화된 방식으로 Icon 스토리를 렌더링해
검증한 적이 없어서 발견되지 않았던 것으로 보인다.
Calendar 컴포넌트에 실제 로직(minDate 이전 날짜 비활성화, 날짜 클릭 시
onDateSelect 호출)을 검증하는 인터랙션 테스트 2건을 추가했다. web-user의
`test` 스크립트는 이제 유닛테스트와 storybook 인터랙션 테스트를 모두 실행하며,
test-web.yml CI에 Playwright Chromium 설치·캐싱 단계를 추가했다.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Au6qVAM3RXf7rAakifYDcL
3 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
📋 요약
백엔드(유닛·DB 통합·API E2E)와 프론트엔드(유닛·Storybook 컴포넌트 인터랙션) 테스트 계층을 새로 구축하고, PR마다 자동으로 도는 CI 게이트(test-backend, test-web)를 추가한다. 그 과정에서 실제 프로덕션 Storybook 빌드에서도 재현되는 Icon 컴포넌트 렌더링 버그를 발견해 함께 수정했다.
✨ 주요 변경사항
test-backend.yml에 DB 통합/E2E 테스트 단계 및 Postgres 서비스 컨테이너 추가unit프로젝트 신설).storybook/main.ts의 Next Image 처리 설정 누락으로Icon컴포넌트의 모든 아이콘이 SVGR 컴포넌트가 아니라 Next Image 객체로 잘못 렌더링되던 문제 수정 (framework.options.image.excludeFiles추가)test-web.yml신설 — web-user/web-seller/web-admin 매트릭스로 프론트엔드 테스트 CI 게이트 추가 (Playwright 브라우저 설치·캐싱 포함)staging/main브랜치 보호에test-web (web-user)/test-web (web-seller)/test-web (web-admin)필수 상태 체크 추가 (기존test-backend와 함께 총 4개)🧪 테스트 계획
📎 참고 사항
.env.test(백엔드 로컬 테스트 DB 접속정보)는 gitignore 대상이라 커밋에 포함되지 않음. CI에서는 워크플로우가 실행 직전 더미 값으로 생성.staging/main브랜치 보호 필수 체크가 4개로 늘어났으므로, 이후 PR은 test-backend + test-web(3개 앱) 전부 통과해야 머지 가능.