[javascript] Enzyme이란 무엇인가?

Enzyme은 두 가지 주요 API 유형을 제공합니다. 첫 번째는 shallow 메서드를 사용하여 컴포넌트를 “shallow” 렌더링하고, 컴포넌트의 props와 state에 액세스하고, 컴포넌트가 렌더링하는 요소를 검사하는 것입니다. 두 번째 API는 mount 메서드를 사용하여 컴포넌트를 “full” 렌더링하고, 컴포넌트 내부의 모든 자식 컴포넌트들을 렌더링하고 상호작용하는 것입니다.

Enzyme은 Jest, Mocha, Chai와 같은 다른 테스트 프레임워크와 함께 사용될 수 있습니다. 또한, Enzyme은 React에서 컴포넌트를 작성하는 것과 유사한 문법을 사용하여 컴포넌트 테스트를 작성할 수 있습니다.

아래의 예제 코드는 Enzyme을 사용하여 간단한 React 컴포넌트 테스트를 작성하는 방법을 보여줍니다:

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

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

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

이 예제에서는 MyComponent라는 간단한 React 컴포넌트를 테스트합니다. 첫 번째 테스트는 컴포넌트를 정상적으로 렌더링할 수 있는지 확인합니다. 두 번째 테스트는 컴포넌트가 올바른 텍스트를 렌더링하는지 확인합니다.

더 자세한 Enzyme 문서를 확인하고 싶다면, 위에서 제공한 Enzyme 공식 문서 링크를 참조하세요.