본문 바로가기

카테고리 없음

Jest 테스트 방법

jest 테스트 방법은 몇가지가 있다.
일단 BDD,AAA를 보겠다.

 

given , when , then을 강조했는데 이걸 좀 보겠다..
이게 뭔지 좀 알아봐야겠다.

 

 

BDD(Behavior-Driven Development)

Behavior-Driven Development, 즉 행위 주도 개발은 테스트를 사용자 관점에서 작성하는 방법이다.
코드를 짜기 전에, **사용자가 기대하는 행동(Behavior)**을 기반으로 테스트를 작성한다.

구성요소:

BDD는 주로 다음 구조로 작성돼요:

  • Given: 어떤 상황이 주어졌을 때 (초기 상태 설명)
  • When: 특정 행동을 했을 때 (테스트할 동작)
  • Then: 기대하는 결과가 나와야 한다 (결과 확인)
test("",()=>{
    given -회원가입 페이지가 그려짐
    when - 이메일 입력,비밀번호,비밀번호 확인 일치
    then - 회원가입 버튼 활성화
})
test("회원가입 버튼 활성화 테스트", () => {
    // given
    const { getByPlaceholderText, getByText } = render(<SignUpPage />);
    const emailInput = getByPlaceholderText("이메일");
    const passwordInput = getByPlaceholderText("비밀번호");
    const confirmPasswordInput = getByPlaceholderText("비밀번호 확인");
    const signUpButton = getByText("회원가입");

    // when
    fireEvent.change(emailInput, { target: { value: "test@example.com" } });
    fireEvent.change(passwordInput, { target: { value: "12345678" } });
    fireEvent.change(confirmPasswordInput, { target: { value: "12345678" } });

    // then
    expect(signUpButton).not.toBeDisabled();
});
  1. 테스트 흐름이 명확해지고 이해하기 쉬움.
  2. 비개발자도 테스트 의도를 파악하기 쉬워져요.
  3. 유지보수성이 높아짐.

AAA (Arrange-Act-Assert) 방식

AAA는 단순히 테스트를 세 단계로 나눠 체계적으로 작성하는 방법이다.
BDD가 "사용자 관점"이라면, AAA는 "개발자 관점"이다.

단계:

  1. Arrange: 테스트의 초기 설정. (테스트에 필요한 데이터를 준비)
  2. Act: 테스트하려는 동작 실행.
  3. Assert: 실행 결과를 검증.

예시 (JavaScript - Jest 사용):

test('2와 3을 더하면 5가 되어야 한다', () => {
  // Arrange
  const num1 = 2;
  const num2 = 3;

  // Act
  const result = add(num1, num2);

  // Assert
  expect(result).toBe(5);
});

 

장점

  • 간결하고 명확함.
  • 테스트의 구조를 체계적으로 유지할 수 있음.

 

 

요약 비교

 

항목 BDD AAA
주요 목적 사용자 관점에서의 행위 테스트 개발자 관점에서 테스트 구조 유지
구성 단계 Given - When - Then Arrange - Act - Assert
읽기 쉬움 비개발자도 이해 가능 개발자에게 익숙한 방식
활용 사례 행동 중심의 비즈니스 로직 테스트 단위 테스트, 기능 테스트

 

  • 만약 사용자 행동을 기준으로 테스트를 짜고 싶다면 BDD!
  • 간단하게 개발 관점으로 체계적인 테스트를 원하신다면 AAA!