Angular

Angular 유닛 테스트: Jasmine vs Jest 비교

인어공쭈 2023. 5. 23. 11:16

Introduction

 Angular 애플리케이션을 개발할 때, 코드의 품질과 안정성을 유지하기 위해 유닛 테스트는 중요한 부분이다. Angular에서는 Jasmine과 Jest와 같은 테스트 프레임워크를 사용하여 유닛 테스트를 작성할 수 있다.


1. Jasmine


 - Jasmine은 Angular에서 따로 설치할 필요 없이 기본으로 포함되어 있는 테스트 프레임워크다.
 - Jasmine은 BDD (Behavior-Driven Development) 스타일의 문법을 제공하여 가독성이 높은 테스트 코드 작성을 도와준다.
 - TestBed, async 함수, RouterTestingModule 등을 사용하여 Angular 테스트 환경을 설정할 수 있다.
 - Jasmine의 describe, it 함수를 사용하여 테스트 스위트와 테스트 케이스를 작성하고, expect 함수와 Matchers를 사용하여 예상 결과를 검증한다.
 - Jasmine은 spyOn 함수와 createSpy를 사용하여 메서드나 함수의 호출을 추적하고 모의 객체를 생성할 수 있다.
 - 코드 커버리지를 측정하기 위해 별도의 설정이 필요하며, Istanbul과 함께 사용한다.

 

2. Jest


 - Jest는 Jasmine을 기반으로 만들어진 테스트 프레임워크로, Angular 프로젝트에서 선택적으로 사용할 수 있다. 별도의 설치가 필요하며, npm 또는 yarn을 사용하여 설치할 수 있다.
 - Jest는 간결하고 직관적인 문법과 풍부한 Mocking 기능을 제공하여 테스트 코드 작성을 더욱 편리하게 만든다.
 - Jest 자체적인 테스트 러너와 Mocking 기능을 사용하여 테스트 환경을 설정할 수 있다.
 - Jest의 describe, test 함수를 사용하여 테스트 스위트와 테스트 케이스를 작성하고, expect 함수와 Matchers를 사용하여 예상 결과를 검증한다.
 - Jest는 Mock 함수와 모듈 Mocking 기능을 통해 모의 객체와 모듈을 생성하여 테스트에 활용할 수 있다.
 - Jest는 자체적으로 코드 커버리지를 제공하며, 설정 없이 코드 커버리지를 측정할 수 있다.

 

 

 

Comparison Example

다음은 Jasmine과 Jest를 사용하여 동일한 기능을 테스트하는 코드 예제.

Jasmine 예제:

import { Calculator } from './calculator';

describe('Calculator', () => {
  let calculator: Calculator;

  beforeEach(() => {
    calculator = new Calculator();
  });

  it('should add two numbers', () => {
    const result = calculator.add(2, 3);
    expect(result).toBe(5);
  });

  it('should subtract two numbers', () => {
    const result = calculator.subtract(5, 3);
    expect(result).toBe(2);
  });
});

 

Jest 예제:

import { Calculator } from './calculator';

describe('Calculator', () => {
  let calculator: Calculator;

  beforeEach(() => {
    calculator = new Calculator();
  });

  test('should add two numbers', () => {
    const result = calculator.add(2, 3);
    expect(result).toBe(5);
  });

  test('should subtract two numbers', () => {
    const result = calculator.subtract(5, 3);
    expect(result).toBe(2);
  });
});

 

위의 예제에서는 Jasmine과 Jest의 문법적인 차이를 확인할 수 있다. Jasmine에서는 it 함수를 사용하고, Jest에서는 test 함수를 사용하여 테스트 케이스를 작성한다. 그러나 두 프레임워크 모두 expect 함수를 사용하여 예상 결과를 검증하는 방식은 동일하다.

 


Conclusion

Angular 프로젝트에서 Jasmine과 Jest는 모두 유닛 테스트를 위한 훌륭한 선택지다. Jasmine은 Angular에 기본으로 내장되어 있으며 테스트 모듈과 함께 사용할수 있고 Jest는 별도의 설치가 필요하지만 Jest 자체적인 테스트 러너와 Mocking 기능을 제공하여 사용하기 편리합니다. 또한 Jest는 자체적으로 코드 커버리지를 제공하며, 설정 없이 코드 커버리지를 측정할 수 있다. 이를 통해서 테스트 작성 경험과 유지보수성을 고려하여 가장 적합한 테스트 프레임워크를 선택하면 된다.

반응형

'Angular' 카테고리의 다른 글

Angular - 동작원리 및 RxJS와 Ngrx  (0) 2024.08.22
Angular Google Maps (AGM) 사용법  (1) 2024.07.11
Angular - RxJS 란?  (0) 2023.03.29
Angular - 타입스크립트의 장점  (0) 2023.03.20
Angular 란?  (0) 2023.03.14