[TIL] 테스트를 작성해보자..

오늘 지금까지 만들었던 핸들러와 모델을 테스트 해보기로 했다.

 

테스트에 쓰이는 도구에는 mocha, jest, jasmine 등등이 있는데 저번에는 mocha를 써보았기에 이번엔 jest를 사용해보고자 한다.

 

오늘 학습한 내용

 

먼저  jest에 대해 찾아본 내용은 다음과 같다.

 

Jest

• 주로 사용되는 분야: React, Node.js, TypeScript, 프론트엔드와 백엔드 통합 테스트 등.
• 특징:
  • 설정 없이 바로 사용 가능: Jest는 기본적으로 많은 기능을 내장하고 있어서, 추가 설정 없이 테스트를 시작할 수 있습니다.
  • 빠른 테스트 실행: Jest는 테스트의 병렬 실행과 캐싱 기능 덕분에 매우 빠르게 실행됩니다.
  • Mocking 지원: Jest는 테스트에서 외부 API나 함수 등을 mock할 수 있는 기능을 기본으로 제공합니다.
  • 단위 테스트, 통합 테스트, 스냅샷 테스트 등 다양한 유형의 테스트를 지원합니다.
  • E2E 테스트: Jest와 함께 Puppeteer 또는 Playwright와 결합하여 E2E 테스트를 수행할 수도 있습니다.
  • TypeScript 지원: TypeScript를 사용할 경우, 별도의 설정을 통해 TypeScript도 지원합니다.
  • Active Community: React와 같은 주요 라이브러리에서 널리 사용되고 있어 커뮤니티와 자료가 많습니다.

현업에서의 사용 예시:

• React 애플리케이션에서는 Jest를 사용한 단위 테스트와 스냅샷 테스트가 일반적입니다.
• Node.js 백엔드 프로젝트에서 통합 테스트 및 API 테스트를 할 때도 Jest를 많이 사용합니다.

 

먼저 jest 테스트를 실행하기 위해서는 모킹할 데이터, 모킹 함수, 테스트 파일이 필요하다.

 

모킹 데이터는 타워 핸들러가 데이터를 읽어오는 부분에서는 실제 DB나 외부 데이터에 접근하지 않도록, 가짜 데이터나 모킹을 설정해야한다.

 

모킹 함수는 예로 gameGoldChange 함수는 게임 내 골드를 차감하거나 변경하는 부분이므로, 테스트에서 외부 의존성을 제거하기 위해 모킹이 필요하다.

// test/mockFunctions.js
export const mockGameGoldChange = jest.fn();

export const mockGetInGame = jest.fn();

 

3가지 다 준비가 되었다면 package.json에서 수정이 필요하다.

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

 

이후 npm run test를 이용해 테스트가 가능해진다.

 

오늘 학습한 내용에 대한 추가 정보

 

Mocha

• 주로 사용되는 분야: Node.js 서버 애플리케이션, API 테스트, 프론트엔드 (Babel과 결합하여).
• 특징:
  • 유연성: Mocha는 다양한 어설션 라이브러리(chai 등) 및 Mocking 라이브러리와 함께 사용할 수 있어 유연한 테스트 환경을 제공합니다.
  • 테스트 러너: Mocha는 테스트를 실행하는 러너로, 자체적으로 Assertion 라이브러리를 제공하지 않기 때문에 보통 chai와 함께 사용합니다.
  • 비동기 테스트: 비동기 코드 테스트에 강력합니다.
  • 자유로운 설정: 기본적으로 단순한 설정으로 시작할 수 있고, 필요한 도구를 자유롭게 추가할 수 있습니다.

현업에서의 사용 예시:

• Node.js 애플리케이션에서 API 테스트, 비즈니스 로직 테스트에 Mocha를 많이 사용합니다.
• TypeScript와 결합하여 사용하기에도 좋은 프레임워크입니다.

 

Jasmine

• 주로 사용되는 분야: Angular 프로젝트, Node.js 백엔드.
• 특징:
  • BDD 스타일: Jasmine은 Behavior-Driven Development(BDD)를 지향하며, 문서화된 스타일로 테스트를 작성할 수 있습니다.
  • 내장 어설션: 기본적으로 expect 구문을 제공하여, 별도의 어설션 라이브러리를 추가하지 않고 사용할 수 있습니다.
  • 비동기 테스트: 비동기 테스트를 위한 done 콜백을 지원합니다.
  • 모듈화: Jasmine은 테스트를 모듈화할 수 있으며, 테스트를 쉽게 그룹화하고 실행할 수 있습니다.

현업에서의 사용 예시:

• Angular 프로젝트에서 Jasmine과 Karma를 함께 사용하는 경우가 많습니다.
• Node.js 백엔드 API와 관련된 단위 테스트에도 사용됩니다.

 

트러블 슈팅

 

1.   > socket_game@1.0.0 test > jest sh: 1: jest: not found 에러

npm install --save-dev jest

 

다음과 같이 개발 의존성으로 설치한 이후 해결되었다.

 

 

2. Jest가 ES6 import 문법을 인식하지 못하기 때문에 발생하는 에러

FAIL test/towerHandler.test.js ● Test suite failed to run Jest encountered an unexpected token Jest failed to parse a file. This happens e.g. when your code or its dependencies use non-standard JavaScript syntax, or when Jest is not configured to support such syntax. Out of the box Jest supports Babel, which will be used to transform your files into valid JS based on your Babel configuration. By default "node_modules" folder is ignored by transformers. Here's what you can do: • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/ecmascript-modules for how to enable it. • If you are trying to use TypeScript, see https://jestjs.io/docs/getting-started#using-typescript • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config. • If you need a custom transformation specify a "transform" option in your config. • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option. You'll find more details and examples of these config options in the docs: https://jestjs.io/docs/configuration For information about custom transformations, see: https://jestjs.io/docs/code-transformation

 

1. 먼저 jest.config.js 파일을 프로젝트 루트 디렉토리에 생성한다.

// jest.config.js
module.exports = {
  transform: {
    "^.+\\.js$": "babel-jest",  // 모든 JS 파일을 babel-jest로 처리
  },
  testEnvironment: "node",  // Node 환경에서 테스트 실행
};

 

2. Babel을 사용하여 ES6모듈을 사용하도록 변환한다.

npm install --save-dev @babel/core @babel/preset-env babel-jest

 

3. babel.config.js를 프로젝트 루트 디렉토리에 생성한다.

// babel.config.js
module.exports = {
  presets: [
    [
      "@babel/preset-env",
      {
        targets: {
          node: "current",
        },
        modules: "commonjs", // ES 모듈을 CommonJS로 변환
      },
    ],
  ],
};

 

4. package.json에서 type:module을 삭제한다.