우테코 프리코스 1주차 과제를 하다가 테스트 코드와 App.js 내
async play()가 하는 역할이 무엇이며, 이 둘 사이의 관계성은 뭘까를 알아보기 위해 Jest에 대해서 검색해보게 되었다.
Unit test
유닛 테스트란, 한마디로 통합이 아닌 단위 테스트를 말한다.
- 유닛 테스트(unit test): 가장 소형 테스트에 속한다. 클래스 범주 내의 함수 단위의 기능을 검증하는 테스트로, 간단하고 명확하며 빠르게 실행된다는 특징을 가지고 있다. 한 함수에 단위 테스트가 많을수록 신뢰도가 높아질 수 있다.
- 통합 테스트(integration test): 중형 테스트에 속한다. 서로 다른 모듈 또는 클래스 간의 동작을 검증하는 테스트이다. 단위 테스트로 함수 단위에서 문제가 없다는 것을 확인하였더라도, 모듈 또는 클래스 간의 데이터 흐름이 개발자의 의도대로 동작하지 않는 겨우도 있어 통합 테스트가 필요하다.
- 유닛 테스트 간 의존성이 있어서는 안된다.
-> 각 유닛 테스트는 개별의 리소스를 생성하여 테스트 해야 한다. (one test per one resource)
Jest
Jest는 Facebook사에서 만든 테스팅 라이브러리이다.
Jest는 라이브러리 하나만 설치하면 Test Runner와 Test Matcher, 그리고 Test Mock 프레임워크까지 제공해 주기 때문에 많은 유저들이 사용한다.
async, await, 그리고 비동기 작동 방식
💡 참고: JavaScript 작동 방식은 비동기이기 때문에 Jest에서 비동기 코드를 테스트하려면
async와await키워드를 사용할 수 있다. 이를 통해 비동기 함수와 프로미스를 다루면서 테스트 케이스를 작성할 수 있다.// Jest에서 비동기 코드를 테스트하는 간단 예제 test('비동기 함수 테스트', async () => { const result = await 비동기_함수(); expect(result).toBe(예상한_값); });
Jest API
test 파일을 만든다. test 파일은 테스트할함수파일명.test.js로 한다.
describe()
여러 개의 test() 코드를 하나의 테스트 작업 단위로 묶어주는 API
describe('Testing 1', () => {
test('message equals to be Vue', () => {
// ..
});
test('data equals to be Object', () => {
// ..
});
});test()
테스트 코드를 돌리기 위한 API
test('message equals to be Vue', () => {
// ..
});expect()
expect()에는 주로 테스트 입력 값 또는 기대 값을 넣는다.
var message = 'Vue';
test('message equals to be Vue', () => {
expect(message).toBe('Vue');
});toBe()
테스트의 결과를 확인하는 API로, 테스트의 예상 결과 값을 넣는다.
var message = 'Vue';
test('message equals to be Vue', () => {
expect(message).toBe('Vue');
});
- 보통
to_처럼 생긴 함수를Test Matcher라고 한다. (Test Matcher 참고 문법)
beforeEach()
테스트 파일의 각 테스트 코드가 돌기 전에 수행할 로직을 넣는 API
var message;
beforeEach(() => message = 'Vue');
test('message equals to be Vue', () => {
expect(message).toBe('Vue');
});
test('message equals to be Vue!!', () => {
expect(message + '!!').toBe('Vue');
});Jest 테스트 실행방법 참고
npm test를 실행하면 프로젝트 내 모든 테스트 파일을 찾아서 테스트를 실행해준다.- Jest는 기본적으로
test.js로 끝나거나__test__디렉토리 안에 있는 파일들은 모두 테스트 파일로 인식한다.- 만약 특정 테스트 파일만 실행하고 싶은 경우에는
npm test <파일명 이나 경로>를 입력하면 된다.
async play()
우테코 1주차 과제에서 주어진 기본 코드는 다음과 같다.
// App.js
class App {
async play() {}
}
export default App;해당 코드는 JavaScript에서 작성된 클래스를 정의하고 내보내는 코드로, async play(){} 메서드를 정의하고 있다.
async play(){}의async는 비동기 함수를 정의하는 부분으로, JavaScript에서 비동기 작업을 수행하는 데 사용된다.- 함수 내에서 비동기 작업을 처리하려면 일반적으로
await키워드를 사용하여 Promise를 처리하게 된다. (참고: [JavaScript] 프로미스(Promise)란)
// play 메서드 내에서 await를 사용하여 비동기 작업을 수행하는 예시
class App {
async play() {
// 비동기 작업을 수행
const result = await someAsyncFunction();
console.log(result);
}
}
export default App;🔆 TIL
일단 Jest가 테스트 코드를 작성하고 실행하는데 사용되는 라이브러리임을 새롭게 알게 되었고, 비동기 처리를 위해async와await이라는 메소드가 사용된다는 것을 확인할 수 있었다.
이제 이런 기초적인 지식을 갖고 두 메소드를 어떤 식으로 활용해야 하는 건지 더 알아봐야 할 것 같다..! 🤔
