"일꾼이 일을 잘하려면 먼저 도구를 갈고 닦아야 한다." - 공자, 『논어』.
첫 장 > 프로그램 작성 > Jest로 JavaScript 앱 테스트

Jest로 JavaScript 앱 테스트

2024-09-01에 게시됨
검색:149

Test Your JavaScript App With Jest

테스트는 애플리케이션이 예상대로 작동하는지 확인하는 소프트웨어 개발의 중요한 부분입니다. JavaScript 생태계에서 가장 인기 있는 테스트 프레임워크 중 하나는 Jest입니다. Facebook에서 개발한 Jest는 단순성과 사용 용이성으로 유명하여 초보자와 숙련된 개발자 모두에게 탁월한 선택입니다.

Jest 시작하기

예제를 살펴보기 전에 프로젝트에 Jest를 설정해 보겠습니다. 아직 설치하지 않았다면 npm:
을 사용하여 설치할 수 있습니다.

npm install --save-dev jest

다음으로 package.json에 테스트 스크립트를 추가합니다.

"scripts": {
  "test": "jest"
}

이제 몇 가지 테스트를 작성할 준비가 되었습니다!
테스트할 간단한 함수를 만들어 보겠습니다. math.js라는 파일을 만듭니다:

// math.js
function add(a, b) {
  return a   b;
}
module.exports = add;

이제 이 함수에 대한 테스트를 작성해 보겠습니다. math.test.js:
라는 파일을 만듭니다.

// math.test.js
const add = require('./math');

test('adds 1   2 to equal 3', () => {
  expect(add(1, 2)).toBe(3);
});

이 테스트에서는 테스트 함수를 사용하여 테스트 사례를 정의합니다. Expect 함수는 add(1, 2)의 결과가 3과 같다고 주장하는 데 사용됩니다.

테스트 실행

터미널에서 다음 명령을 실행하여 테스트를 실행할 수 있습니다.

npm test

테스트가 통과되었음을 나타내는 출력이 표시됩니다.

비동기 코드 테스트

Jest는 비동기 코드 테스트도 지원합니다. 비동기 함수를 포함하도록 math.js 파일을 수정해 보겠습니다.

// math.js
function fetchData() {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve('peanut butter');
    }, 1000);
  });
}

module.exports = { add, fetchData };

이제 fetchData에 대한 테스트를 작성해 보겠습니다.

// math.test.js
const { add, fetchData } = require('./math');

test('adds 1   2 to equal 3', () => {
  expect(add(1, 2)).toBe(3);
});

test('fetches data', async () => {
  const data = await fetchData();
  expect(data).toBe('peanut butter');
});

이 테스트에서는 테스트 기능을 비동기로 표시하고 Promise가 해결될 때까지 대기를 사용합니다.

모의 기능

Jest는 강력한 조롱 기능을 제공합니다. API 호출을 수행하는 함수가 있다고 가정해 보겠습니다. 이 함수를 모의하여 테스트 중에 동작을 제어할 수 있습니다.
예는 다음과 같습니다.

// api.js
const axios = require('axios');

async function getUser() {
  const response = await axios.get('https://api.example.com/user');
  return response.data;
}

module.exports = getUser;

테스트에서 Axios를 모의할 수 있습니다.

// api.test.js
const axios = require('axios');
const getUser = require('./api');

jest.mock('axios');

test('fetches user data', async () => {
  const user = { name: 'John Doe' };
  axios.get.mockResolvedValue({ data: user });

  const result = await getUser();
  expect(result).toEqual(user);
});

이 테스트에서는 axios.get 메서드를 모의하여 사전 정의된 응답을 반환하므로 실제 API 호출 없이 getUser를 테스트할 수 있습니다.

Jest는 JavaScript 애플리케이션에 대한 테스트를 쉽게 작성하고 실행할 수 있게 해주는 강력한 테스트 프레임워크입니다. 간단한 구문, 비동기 코드 지원, 내장된 모의 기능을 통해 Jest는 코드가 안정적이고 유지 관리 가능하도록 보장할 수 있습니다. 지금 바로 Jest를 프로젝트에 통합하고 자동화된 테스트의 이점을 누려보세요.

릴리스 선언문 이 글은 https://dev.to/jospin6/test-your-javascript-app-with-jest-314c?1에서 복제됩니다.1 침해 내용이 있는 경우, [email protected]으로 연락하여 삭제하시기 바랍니다.
최신 튜토리얼 더>

부인 성명: 제공된 모든 리소스는 부분적으로 인터넷에서 가져온 것입니다. 귀하의 저작권이나 기타 권리 및 이익이 침해된 경우 자세한 이유를 설명하고 저작권 또는 권리 및 이익에 대한 증거를 제공한 후 이메일([email protected])로 보내주십시오. 최대한 빨리 처리해 드리겠습니다.

Copyright© 2022 湘ICP备2022001581号-3