리액트 네이티브 앱을 개발할 때 테스트 커버리지를 확인하고 싶은 경우, Enzyme 라이브러리를 사용해 테스트 커버리지 보고서를 생성할 수 있습니다. 이 방법을 통해 프로젝트의 테스트 커버리지를 간편하게 파악하고 필요한 개선 작업을 수행할 수 있습니다.

1. Enzyme 설치

먼저, Enzyme을 설치해야 합니다. 터미널에서 프로젝트 디렉토리로 이동한 뒤 다음 명령어를 실행하세요:

npm install --save-dev enzyme enzyme-adapter-react-16 enzyme-to-json

2. 테스트 파일 작성

테스트 커버리지를 확인하려는 파일에 대한 테스트 파일을 작성해야 합니다. 일반적으로, .test.js나 .spec.js 확장자를 사용하여 테스트 파일을 작성합니다. 예를 들어, MyComponent.js 파일을 테스트하는 테스트 파일을 작성해보겠습니다:

import React from 'react';
import { shallow } from 'enzyme';
import MyComponent from './MyComponent';

describe('MyComponent', () => {
  it('renders without crashing', () => {
    shallow(<MyComponent />);
  });

  it('renders the correct text', () => {
    const wrapper = shallow(<MyComponent />);
    expect(wrapper.text()).toEqual('Hello, World!');
  });
});

위의 예시에서는 shallow() 메소드를 사용해 MyComponent 컴포넌트를 렌더링하고, 원하는 결과 값을 확인하는 테스트를 작성했습니다.

3. 테스트 실행 및 커버리지 확인

테스트 파일을 작성한 후에는 테스트를 실행하여 커버리지를 확인할 수 있습니다. 터미널에서 다음 명령어를 실행하세요:

npm test -- --coverage

위 명령어를 실행하면 Jest가 테스트를 실행하고 커버리지 보고서를 생성합니다. 커버리지 보고서는 coverage 디렉토리에 생성되며, HTML 형식으로 확인할 수 있습니다. 디렉토리에 있는 index.html 파일을 열어서 커버리지 보고서를 확인하세요.

결론

Enzyme을 사용해 리액트 네이티브 앱의 테스트 커버리지를 확인할 수 있습니다. 이를 통해 프로젝트의 테스트의 품질을 향상시키고 버그를 예방할 수 있습니다. 테스트 커버리지 보고서를 주기적으로 확인하여 개선 작업을 수행하세요.

참고 문서:

• Enzyme 공식 문서
• Jest 공식 문서
• 리액트 네이티브 공식 문서