테스트 자동화
BDD(Behavior Driven Development)
- BDD에서는 스펙을 먼저 작성하고 난 후에 구현을 시작함
- 구현이 종료된 시점에는 스펙과 코드 둘 다 확보할 수 있음
개발 순서
- 명세서 초안 작성(기본적인 테스트 포함)
- 명세서 코안을 보고 코드 작성
- 코드가 작동하는지 확인하기 위해 테스트 프레임워크를 사용해 명세서 실행(Mocha 사용). 테스트를 모두 통과해 에러가 출력되지 않을 때까지 코드 수정
- 모든 테스트를 통과하는 코드 초안 완성
- 명세서에서 고려하지 않았던 유스케이스 추가
- 세번째 단계로 돌아가 테스트를 모두 통과할 때까지 코드를 수정
- 기능이 완성될 때까지 3~6단계 반복
스펙의 용도
- 테스트: 함수가 의도하는 동작을 제대로 수행하고 있는지 보장함
- 문서: 함수가 어떤 동작을 수행하고 있는지 설명 - describe와 it에 설명이 들어감
- 예시: 실제 동작하는 예시를 이용해 함수를 어떻게 사용할 수 있는지 알려줌
테스트 라이브러리
- Mocha: 핵심 테스트 프레임워크로, describe, it과 같은 테스팅 함수와 테스트 실행 관련 주요 함수 제공
- Chai: 다양한 assertion을 제공해 주는 라이브러리
- Sinon: 함수의 정보를 캐내는 데 사용되는 라이브러리로, 내장 함수 등을 모방
- 스펙이 있기 때문에 개발자는 안전하게 함수를 개선하거나 변경할 수 있음
- 함수를 처음부터 다시 작성해야 하는 경우가 생겨도 스펙이 있으면 기존 코드와 동일하게 동작한다는 것을 보장할 수 있음
- 코드가 바뀌어도 기존에 구현된 기능에 영향을 주지 않게 하는 건 대규모 프로젝트에서 매우 중요함
- 프로젝트 규모가 커지면 함수 하나를 이곳저곳에서 사용하는데, 수동으로 변경된 함수가 이 함수를 사용하는 모든 곳에서 제대로 동작하는지 확인하는 건 불가능하기 때문
- 테스트를 하지 않고 코드를 작성한다면, 아래 둘 중 한 갈래의 길로 빠지게 됨
- 아무 대책 없이 코드를 변경 - 부작용을 생각하지 않고 함수를 수정했기 때문에 어디선가 버그가 발생함
- 수정이가 개선을 기피하게 됨 - 버그가 발생하는 것을 피하기 위해 코드가 구식이 되어도 아무도 코드를 건드리지 않음
테스팅 자동화의 장점
- 코드에 변화가 있어도 스펙을 실행해 테스트를 진행하면 몇 초 만에 에러 발생 여부를 확인할 수 있음
- 잘 테스트 된 코드는 더 나은 아키텍처를 만듦
- 수정과 개선이 쉽기 때문에 당연히 좋은 아키텍처를 만들 수 있음
- 테스트를 작성하려면 함수가 어떤 동작을 하는지, 입력값은 무엇이고 출력값은 무엇인지 정의하고 난 후에 구현을 시작함
- 코드는 정의된 사항을 뒷받침 할 수있게 작성해야 하기 때문에, 구현을 시작하는 순간부터 이미 좋은 아키텍처가 보장됨
- 테스트를 작성하면 일반적으로 개발 속도가 빨라지고 이전보다 코드를 더 안정적으로 작성할 수 있음
폴리필(Polyfill)
- 변경된 표준을 준수할 수 있게 기존 함수의 동작 방식을 수정하거나, 새롭게 구현한 함수의 스크립트
- 명세서에 새로운 문법이나 기존에 없던 내장 함수에 대한 정의가 추가됨
- 새로운 문법을 사용해 코드를 작성하면 트랜스파일러는 이를 구 표준을 준수하는 코드로 변경해줌
- 새롭게 표준에 추가된 함수는 명세서 내 정의를 읽고 이에 맞게 직접 함수를 구현해야 사용할 수 있음
- 개발자는 스크립트에 새로운 함수를 추가하거나 수정해서 스크립트가 최신 표준을 준수할 수 있게 작업할 수 있음
- core.js: 다양한 폴리필 제공, 특정 기능의 폴리필만 사용하는 것도 가능
- polyfill.io: 기능이나 사용자의 브라우저에 따라 폴리필 스크립트를 제공해주는 서비스
바벨(Babel)
- 모던 자바스크립트 코드를 구 표준을 준수하는 코드로 바꿔주는 트랜스파일러
- 개발자의 컴퓨터에서 돌아가는데, 이를 실행하면 기존 코드가 구 표준을 준수하는 코드로 변경됨
- 변경된 코드는 웹사이트 형태로 사용자에게 전달됨
- 웹팩(Webpack)과 같은 모던 프로젝트 빌드 시스템은 코드가 수정될 때마다 자동으로 트랜스파일러를 동작시킴
- 이런 과정이 없으면 개발이 끝난 코드를 한데 통합하는 데 어려움이 있으므로, 트랜스파일러와 폴리필은 필수
'JavaScript' 카테고리의 다른 글
| 객체 (1) | 2023.11.21 |
|---|---|
| 기본 문법 요약 정리 (2) | 2023.11.09 |
| [구름톤 챌린지] 4주차_중첩 점 (1) | 2023.09.08 |
| [구름톤 챌린지] 4주차_통신망 분석 (1) | 2023.09.06 |
| [구름톤 챌린지] 3주차_작은 노드 (0) | 2023.09.01 |