TDD

코드를 작성하기 전에 테스트를 쓰는 소프트웨어 개발 방법론이다.
TDD를 통해 소프트웨어를 개발한다는 것은 작은 단위의 테스트 케이스를 작성하고, 이를 통과하는 코드를 작성하는 과정을 반복하는 것을 의미한다.

TDD 개발주기

 Red 단계에서는 실패하는 테스트 코드를 먼저 작성한다.

 Green 단계에서는 테스트 코드를 성공시키기 위한 실제 코드를 작성한다.

 Blue 단계에서는 중복 코드 제거, 일반화 등의 리팩토링을 수행한다.

실패하는 테스트 코드를 작성할 때까지 실제 코드를 작성하지 않는 것과, 실패하는 테스트를 통과할 정도의 최소 실제 코드를 작성해야하는 것이다

=>실제 코드에 대해 기대되는 바를 보다 명확하게 정의 함으로써 불필요한 설계를 피할 수 있고, 정확한 요구 사항에 집중할 수 있다.

TDD  장점

보다 튼튼한 객체 지향적인 코드 생산

TDD는 코드의 재사용 보장을 명시하므로 TDD를 통한 소프트웨어 개발 시 기능 별 철저한 모듈화가 이뤄진다.

종속성과 의존성이 낮은 모듈로 조합된 소프트웨어 개발을 가능하게 하며 필요에 따라 모듈을 추가하거나 제거해도 소프트웨어 전체 구조에 영향을 미치치 않게 된다.

 

재설계 시간의 단축

테스트 코드를 먼저 작성하기 때문에 개발자가 지금 무엇을 해야하는지 분명히 정의하고 개발을 시작하게되고  테스트 시나리오를 작성하면서 다양한 예외사항에 대해 생각해 볼 수 있다

=>개발 진행 중 소프트웨어의 전반적인 설계가 변경되는 일을 방지할 수 있다.

 

디버깅 시간의 단축

 사용자의 데이터가 잘못 나온다면 DB의 문제인지, 비즈니스 레이어의 문제인지 UI의 문제인지 실제 모든 레이어들을 전부 디버깅 해야하지만, TDD의 경우 자동화 된 유닛 테스팅을 전제하므로 특정 버그를 손 쉽게 찾아낼 수 있다.

 

테스트 문서의 대체 가능

주로 SI 프로젝트 진행 과정에서 어떤 요소들이 테스트 되었는지 테스트 정의서를 만든다 (단순 통합 테스트문서에 지나지 않는다) 하지만 TDD를 하게 될 경우 테스팅을 자동화 시킴과 동시에 보다 정확한 테스트 근거를 산출 할 수 있다.

 

추가 구현의 용의함

개발이 완료된 소프트웨어에 어떤 기능을 추가할 때 가장 우려되는 점은 해당 기능이 기존 코드에 어떤 영향을 미칠지 알지 못한다는 것이다. 하지만 TDD의 경우 자동화된 유닛 테스팅을 전제하므로 테스트 기간을 획기적으로 단축시킬 수 있다.

 

 

TDD 개발 방식의 단점

바로 생산성 저하이다.

개발 속도가 느려진다고 생각하는 사람이 많기 때문에 TDD에 대해 반신반의 한다.

왜냐하면 처음부터 2개의 코드를 짜야하고 중간중간 테스트를 하면서 고쳐나가야하기 때문이다.

TDD 방식의 개발 시간은 일반적인 개발 방식에 비해 대략 10~30% 정도로 늘어난다.

SI 프로젝트에서는 소프트웨어의 품질보다는 납기일 준수가 훨씬 중요하기 때문에 TDD 방식을 잘 사용하지 않는다.

 

 

⭐️ 리액트 TDD

Testing Library, Jest 를 이용해서 할 수 있다.

Testing Library는 create-react-app을 이용하여 React 프로젝트를 생성하면 자동으로 Testing Libarary를 이용할 수 있고, 컴포넌트나 클릭 이벤트등 다양한 곳에 사용할 수 있다.

Jest는 JavaScript의 Testing Framework / Test Runner로써, 테스트 파일을 자동으로 찾아 테스트를 실행하고, 함수로 테스트를 체크하여 테스트가 성공인지 실패인지를 판단해 준다.

 

$ npx create-react-app my-app

 

 

CRA를 하고 package.json 파일 안에 자동으로 설치되는데, @testing-library 3개가 테스트 수행하는 라이브러리이다.

/jest-dom : Jest-dom 제공하는 custom matcher를 사용할 수 있게 해준다.
/react : 컴포넌트의 요소를 찾기 위한 query가 포함되어 있다.
/user-event : click 등 사용자 이벤트에 이용된다.

 

 

test, it, describe 함수를 사용하고, expect().toBe() 로 확인한다.
함수의 인자로는 2개를 받는다. 인자1 뭐하는 테스트인지 설명할 string, 테스트할 콜백함수
describe 함수 블록은 Test Suites라고 불리며 test/it 함수 블록은 Test(Test Case)라고 한다

test('올바르게 계산하는 테스트입니다', () => {
	expect(15 + 15 ).toBe(30)
})

it('2 곱하기 3가 6인 테스트', () => {
	expect(2 * 3 ).toBe(6)
})

//describe 를 사용하면 여러 케이스 작성이 가능하다.

describe('여러 테스트들', () => {
  it('올바르게 계산하는 테스트입니다', () => {
      expect(7 + 7 ).toBe(14)
  })

  it('2 곱하기 2가 4인 테스트', () => {
      expect(2 * 2 ).toBe(4)
  })
})

https://www.happykoo.net/@happykoo/posts/63=>mocha 사용법