jtwjs Dev Wiki
  • DEV_ROAD
    • 💪🏻 생존하기
    • Week 1
      • 개발 환경 세팅
      • 타입스크립트
      • 리엑트
      • Testing Library
      • Parcel & ESLint
    • Week 2
      • JSX
      • Virtual DOM
    • Week 3
      • React Component
      • React State
    • Week 4
      • Express
      • Fetch API & CORS
      • React Hook
      • useRef & Custom Hook
    • Week 5
      • TDD
      • React Testing Library
      • MSW
      • Playwrite
      • Snapshot
    • Week 6
      • Separtion of Concerns
      • Principle
      • DI, (Dependency Injection)
      • Reflect-metadata
      • TSyringe
      • External Store
      • Follow Redux
      • usestore-ts
      • useSyncExternalStore
    • Week 7
      • Routing
      • Routes
      • Router
      • Navigation
    • Week 8
      • Design System
      • Style Basics
      • CSS-in-JS
      • Styled-Components
      • Global Style & Theme
    • Week 9
      • 개발하기 전 준비
      • 상품 목록 페이지
      • 상품 상세 페이지
      • 장바구니 페이지
    • Week 10
      • 로그인
      • 로그아웃
      • 회원가입
      • 주문 목록 & 주문 상세
    • Week 11
      • 배송 정보 입력
      • 포트원 결제 요청
      • 배송 및 결제 정보 전달
    • Week 12
      • 관리자 웹사이트개발시작
  • DEV_NOTE
    • TypeScript
      • 기본적 문법
        • Enum
        • 다형성
          • Untitled
        • 구조적 타이핑
        • 제너릭 타입
        • 컨디셔널 타입
        • 함수 메서드 타이핑
        • infer로 타입스크립트의 추론 직접 활용
        • 재귀 타입
        • 템플릿 리터럴 타입
        • 추가적인 타입 검사 satisfies 연산자
        • 타입스크립트 건망증
        • 원시 자료형에도 브랜딩 기법 사용 가능
        • 타입 좁히기
        • 유용한 타입 만들기
        • 데코레이터 함수
        • 앰비언트 선언도 선언 병합이 된다.
        • 앰비언트 선언도 선언병합이 된다.
    • Testing
      • Unit Testing
      • 단위 테스트의 두 분파
      • 좋은 단위 테스트를 구성하는 4대 요소
      • 테스트 대역과 식별할 수 있는 동작
      • 단위 테스트 스타일
      • 가치 있는 단위 테스트를 위한 리팩토링
      • 통합 테스트
      • Cross Browsing Testing
      • 기능 테스트 종류
      • React Testing Pattern
      • 프론트엔드 테스트 입문
        • 테스트 범위
        • 단위 테스트 검증
        • Mock
        • UI 컴포넌트 테스트
        • 테스트 커버리지
        • 웹 통합 테스트
        • MSW
        • 스토리북
        • 시각적 회귀 테스트
        • E2E 테스트
        • Github Actions 설정
        • 깃허브 액션에서 E2E
      • 시프트 레프트
        • 테스트 기본중의 기본
        • 단위 테스트
        • 코드 복잡도
        • 리팩터링
        • 코드 리뷰
        • 통합 테스트 패턴
        • 시스템 테스트의 자동화
        • 탐색적 테스트
      • Test Tip
      • vitest
      • playwright
      • Test Data Generator
      • MSW
    • Algorithm
      • coding test
      • Data Structure
    • Next.js
      • Data Fetching
      • Hydration
      • Next 13
      • Optimization
      • Next 15
    • Tailwind
      • Tailwind CSS
      • Theme
      • Directives
      • Tool
      • Design System
    • Storybook
      • Storybook
      • CSF3
      • CDD
      • Headless Component
    • Funtional Programming
      • 함수형 프로그래밍
      • 참조 투명성
      • 부수효과
      • 함수 합성
      • 제너릭 타입 활용하기
      • 암묵적 입출력
      • 액션과 계산, 데이터
      • 계층형 설계
      • 호출 그래프
      • 함수형 설계
      • 불변성
      • 일급 함수
      • 함수형 도구
    • Git
      • Github Actions
      • Conflict
      • Branch 전략
    • Contents Format
      • Audio
    • 3D Graphic
      • 3D keyword
      • Three.js
      • Geometry
      • Material
      • Light
      • Camera
      • Decal
      • Rotation
      • Text
      • Shadow
      • Fog
      • Post Processing
      • Animation
      • Math
        • Vector Space
        • 벡터의 연산
        • 회전 계산
      • 3D 컨텐츠가 만들어지는 과정
      • R3F
      • Env
      • Scene
      • Transform
      • R3F
      • Interaction & Raycast
      • Rendering Algorithnm
      • Blender
      • Blender
    • Accessibility
      • 접근성이란
    • Interactive Web
      • Parallax
      • Canvas
      • requestAnimationFrame
      • Effect
      • HSL
      • React.js + Canvas
      • Matter.js
    • AWS
      • DevOps
      • Amplify
      • S3
      • 클라우드 컴퓨팅
        • 온프레미스와 클라우드
        • 클라우드 도입효과
        • 클라우드 컴퓨팅의 범위
        • 컴퓨팅 옵션
          • EC2 - Virtual Machin
          • ECS, EKS - Container
          • Lambda - Serverless
        • 네트워크 가상화
        • 스토리지
        • 데이터베이스
        • 데이터 수집
        • 머신 러닝 영역
        • IoT 영역
        • 블록체인 영역
      • 클라우드 아키텍처 설계
    • Network
      • Web Server & WAS
    • System Design
      • System Design
      • Component
      • 의존성을 배제한 개발
      • Error Handling
      • Architecture
        • 모노로틱 아키텍처
        • Clean Architecture
        • Layered Architecture
        • 이벤트 기반 아키텍처
      • 상황을 파악하는 메타인지
      • 중복 문제 해결하기
      • Monorepo Arhitecture
        • 모노레포 운영과 트러블슈팅
        • Module Federation
      • 코드 병목지점
      • API 대응
      • 공통 코드
      • Infra 구축
      • 모듈 기반의 개발 방식
      • Design System
        • 최소 수준의 아키텍처 설정
        • 더 효율적인 디자인시스템 만들기
        • 디자인 시스템과 UI 라이브러리 목적
        • 디자인 토큰
      • 효율적인 업무
        • 업무 프로세스 병목 파악
      • Clean Code
      • Design Pattern
        • CQRS Pattern
        • Strangler Fig Pattern
        • 데코레이터 패턴
        • 커맨드 패턴
        • 전략 패턴
        • 옵저버 패턴
      • A/B 테스팅
      • 대규모 리엑트 웹앱 개발
        • 복잡성 관리
        • 모듈성
        • 성능
        • 디자인 시스템
        • 데이터 패칭
        • 상태 관리
        • 국제화
        • 코드 조직화하기
        • 개인화 A/B 테스팅
        • 확장 가능한 웹 아키텍처
        • 테스팅
        • 툴링
        • 기술적 마이그레이션
        • 타입스크립트
        • 라우팅
        • 사용자 중심 API 디자인
        • 리액트 미래
    • Performance
      • React DevTools
      • Component 최적화
      • Page Load
      • API
    • MFA
      • MSA
      • MFA 도입하기
      • Monorepo
        • Monorepo Tool
        • Yarn Berry Workspace
        • Turborepo
      • MFA Composition
      • SPA 통합
      • Design System
      • Package Manager
        • Yarn
        • pnpm
      • Transpiler & Bundler
        • Babel
        • Rollup
        • esbuild
        • swc
        • Webpack
        • Vite
      • 분해와 통합을 위한 여러 기술 비교
    • State Management
      • Zustand
    • React v18
      • Automatic batching
      • Suspense
      • Transition
    • SEO
      • Search Engine Optimization
      • Open Graph Element
      • Metadata
    • FE Develop
      • Scrubbing
      • Clipboard
    • Refactoring
      • 리팩토링 깊게 들여다보기
      • 긴 코드 조각내기
      • 타입 코드 처리하기
      • 유사한 코드 융합하기
      • 데이터 보호
      • 코드 추가 및 제거
    • OAuth 2.0
    • Analytics
      • Mixpanel
    • ETC
      • VSCode
    • React Hook In Action
      • useContext & Provider
      • 커스텀 훅
      • 코드 분할하기 with Suspense, lazy
      • Suspense와 이미지 적재하기
      • useTransition, uesDeferredValue
      • SuspenseList
Powered by GitBook
On this page
  • 단위 테스트의 정의
  • 고전파 vs 런던파
  • 고전파(Classical school)
  • 런던파(London school)
  • 의존성 종류
  1. DEV_NOTE
  2. Testing

단위 테스트의 두 분파

단위 테스트의 정의

  • 작은 코드 조각(단위)을 검증

  • 빠르게 수행

  • 격리된 방식으로 처리하는 자동화된 테스트

단위 테스트 정의 중 격리된 방식에 대한 논쟁으로 두 개의 단위테스트 분파로 나뉘었다.

고전파 vs 런던파

  • 고전파: 모든 사람이 단위 테스트와 TDD에 원론적으로 접근하는 방식이라 '고전'이라 칭함

  • 런던파: 런던의 프로그래밍 커뮤니티에서 시작됨

    • 목 추종자(mockist)로 불리기도 함, 그만큼 목(mock)을 많이 활용한다는 말이겠지

단위 테스트의 정의에서 격리문제를 어떻게 다루는지의 의견차이는 '단위'가 무엇을 의미하는지에 대한 관점과 테스트 대상 간 의존성 처리 방식에 영향을 미친다.

고전파(Classical school)

단위 테스트를 격리해서 실행해야 한다고 보는 입장

단위 테스트를 격리한다는 것은 테스트간 공유되는 의존성을 격리하는 것을 의미한다.(즉, 공유 의존성만 목(mock)으로 대체)

테스트 코드의 단위를 검증하는 것이 아닌 동작 단위, 즉 문제 영역에서 의미가 있는것을 검증해야 한다.

동작 단위를 구현하는데 필요한 모듈이 몇개인지는 상관없다.

고전파 방식의 TDD 단점 이자 장점

오작동하는 다른 모듈을 참조하는 테스트를 할 때 실패할 수도 있다. 즉, 하나의 버그가 전체 시스템에 걸쳐 테스트 실패를 야기하는 파급효과를 가져온다. 결국 문제의 원인을 찾기 더 어려워진다.

이는 테스트를 정기적으로(소스 코드가 변경될 때 마다) 실행하면 버그의 원인을 알아낼 수 있다. 실패한 테스트를 모두 볼 필요는 없다. 버그가 생긴 코드 한 곳만 고치면 다른것들도 자동으로 고쳐진다.

오히려 이렇게 계단식으로 실패하는 것은 가치가 있다. 하나의 코드 조각이 여러 개의 테스트에서 실패를 일으킨다면, 해당 코드 조각은 전체 시스템에서 매우 중요한 역할을 하고 있을 가능성이 높다는것을 의미한다. 따라서 해당 코드 조각을 수정할 때는 전체 시스템에 큰 영향을 미치지 않도록 주의해서 작업하라는 유용한 정보가 된다.

응집도 높은 동작 단위 테스트

테스트는 해결하는 데 도움이 되는 문제에 대한 이야기를 들려줘야하며, 일반 사람들이 볼 때에도 응집도가 높고 의미가 있어야 한다.

응집도가 높은 테스트: 우리집 강아지를 부르면, 바로 나에게 온다.

응집도가 낮은 테스트: 우리집 강아지를 부르면 먼저 왼쪽 앞다리를 움직이고, 이어서 오른쪽 앞다리를 움직이고....

실제 동작 대신 코드 단위를 목표로 테스트할 때 응집도가 낮은 테스트가 되기 쉽다.

런던파(London school)

테스트 대상인 코드 조각을 격리해야한다고 보는 입장

불변 의존성을 제외한 모든 의존성 있는 코드는 목(mock)으로 대체한다.

런던파 방식의 TDD 장점

  • 테스트가 실패하면 코드베이스의 어느 부분이 고장 났는지 확실히 알 수 있다.

런던파 방식의 TDD 단점

  • 테스트 대상의 초점이 동작 단위가 아닌 코드 단위이기 때문에 개별 테스트 수도 많아지고 테스트 목적이 뚜렷해지지 않는다.

  • 목(mock)을 사용함으로써 코드 설계상 문제가 되는 코드베이스를 숨긴다.

  • 목(mock) 객체를 많이 사용하므로 테스트 코드가 복잡해지고 유지보수하기 어려워진다.

의존성 종류

  • 공유 의존성: 테스트 간 서로 공유되고 서로의 결과에 영향을 미칠 수 있는 수단을 제공하는 의존성

    • 휘발성 의존성: 런타임 환경의 설정 및 구성을 요구(DB) or 비결정적인 동작을 포함(난수 생성기 처럼 호출마다 다른 결과를 제공하는 것)

  • 비공개 의존성: 공유하지 않는 의존성

  • 프로세스 외부 의존성: 애플리케이션 실행 프로세스 외부에서 실행되는 의존성

ex) 테스트 결과에 서로 영향을 주는 공유 의존성이면서 프로세스 외부 의존성 -> DataBase

PreviousUnit TestingNext좋은 단위 테스트를 구성하는 4대 요소

Last updated 1 year ago