본문으로 바로가기

TDD 2

category JavaScript/Test 2020. 11. 25. 17:25

increase()

이번에 구현할 기능은 increase다

increase메소드를 실행하면 value의 값이 1증가하게된다

테스트 코드

테스트 코드를 먼저 만들어 보자

describe('increase()', ()=>{
  it('increase는 값을 1 증가시킨다', ()=>{
    const counter = App.ClickCounter();
    counter.increase();
    expect(counter.getValue()).toBe(1);
  });
});

저번 포스팅에 봤던 테스트 코드 바로 밑에 추가한 것 이제 실제 코드를 짜러 가 보자

실제 코드

App.ClickCounter = ()=>{
    let value = 0;
    return {
        getValue() {
            return value;
        },
        increase() {
            value++;
        }
    }
}

매우 간단..

당연히 성공했다

리팩토링

이번엔 테스트 코드에 리팩토링 할 부분이 있다

1. 중복된 코드

describe('ClickCounter', ()=> {
  describe('getCounter()', ()=> {
    it('초기값이 0인 카운터 값을 반환한다', ()=> {
      const counter = App.ClickCounter();
      expect(counter.getValue()).toBe(0);
    });
  });
  describe('increase()', ()=>{
    it('increase는 값을 1 증가시킨다', ()=>{
      const counter = App.ClickCounter();
      counter.increase();
      expect(counter.getValue()).toBe(1);
    });
  });
});

중복되는 부분이 보이는가?

각 테스트 케이스에 counter객체를 매번 생성해주고 있다

이 부분을 제거해줘야하는데 자스민에 이러한 기능이 있다

beforeEach를 사용하면 되는데 각 테스트 케이스를 실행하기 전에 실행되는 메소드이다

비슷한 걸로 테스트케이스 후에 실행되는 afterEach도 있다

describe('ClickCounter', ()=> {
  let counter;
  beforeEach(()=>{
    counter = App.ClickCounter();

  });
  describe('getCounter()', ()=> {
    it('초기값이 0인 카운터 값을 반환한다', ()=> {
      expect(counter.getValue()).toBe(0);
    });
  });
  describe('increase()', ()=>{
    it('increase는 값을 1 증가시킨다', ()=>{
      counter.increase();
      expect(counter.getValue()).toBe(1);
    });
  });
});

이제 중복이 사라졌다

2. increase()

increase() 테스트 케이스를 보면 value값이 1임을 확인하는 것을 볼 수 있는데

value의 초기값이 0이 아니라면 이 테스트 코드는 실패하게된다

이부분을 수정해보자

describe('increase()', ()=>{
  it('increase는 값을 1 증가시킨다', ()=>{
    const initialValue = counter.getValue();
    counter.increase();
    expect(counter.getValue()).toBe(initialValue + 1);
  });
});

increase가 실행되기 전의 값을 저장해둔 initialValue를 increase가 실행된 후에

getValue의 값과 initialValue+1의 값이 같은지 비교하고 있다

'JavaScript > Test' 카테고리의 다른 글

TDD-spyOn  (0) 2020.11.29
TDD-error  (0) 2020.11.27
TDD-view  (0) 2020.11.26
TDD 1  (0) 2020.11.24
자바스크립트 TDD  (0) 2020.11.20