programing

기능에 대한 Jest Spy

topblog 2023. 2. 27. 23:19
반응형

기능에 대한 Jest Spy

Mocha에서 Jest로 스와프하고 있는데, 리액트 방식으로 스파이 할 수 있는 방법이 있는지 궁금합니다.예를 들어 내 컴포넌트에 다음과 같은 메서드가 있다고 가정해 보겠습니다.sdk라이브러리는 jQuery Ajax 호출만 구성합니다).

getData() {
    sdk.getJSON('/someURL').done(data => {
        this.setState({data});
    });
}

Sinon을 사용하여 다음과 같이 프로토타입을 염탐하여 테스트합니다.

it('should call getData', () => {
    sinon.spy(Component.prototype, 'getData');
    mount(<Component />);
    expect(Component.prototype.getData.calledOnce).to.be.true;
});

이렇게 하면 메서드를 조롱하지 않고 코드 커버리지를 보장할 수 있습니다.Jest에도 비슷한 기능이 있나요?

편집: 또한 이 기능이 존재하지 않는 경우 API 호출을 테스트하기 위한 차선책은 무엇입니까?

사실 당신은 jeak.spyOn jeak.spyOn을 사용할 수 있습니다.

컴포넌트가 생성되었을 때 메서드가 호출된 경우:

import { mount } from 'enzyme'; 

describe('My component', () => {
  it('should call getData', () => {
    const spy = jest.spyOn(Component.prototype, 'getData');
    mount(<Component />);
    expect(spy).toHaveBeenCalledTimes(1)
  });
})

또는 DOM 및 메서드 사용 바인드에 있는 경우 다음을 사용할 수 있습니다.

import { shallow } from 'enzyme'; 

describe('My component', () => {
  it('should call getData', () => {
    const wrapper = shallow(<Component />);
    const instance = wrapper.instance()
    const spy = jest.spyOn(instance, 'getData');
    wrapper.find('button').simulate('click')
    expect(spy).toHaveBeenCalledTimes(1)
  });
})

얼마 전 v19에서 소개된 바로 그 방법이 있습니다.

당신은 새로운 것을 선택할 수 있다.spyOn메서드 또는 다음 방법도 정상적으로 동작합니다.

it('should call getData', () => {
    Component.prototype.getData = jest.fn(Component.prototype.getData);
    expect(Component.prototype.getData).toBeCalled();
});

리액트 16.8에서 Jest를 사용하고 있습니다.이거는 효과가 있었어요.

  it("lifecycle method should have been called", () => {
    jest.spyOn(RedirectingOverlay.prototype, 'componentWillUnmount');
    jest.spyOn(RedirectingOverlay.prototype, 'componentDidMount');
    const wrapper = mount(<RedirectingOverlay message="Hi There!"/>);
    expect(RedirectingOverlay.prototype.componentDidMount).toHaveBeenCalledTimes(1)
    wrapper.unmount()
    expect(RedirectingOverlay.prototype.componentWillUnmount).toHaveBeenCalledTimes(1)
  })

사용방법:

  • "enzyme": "^3.6.0"
  • "jest": "23.5.0"
  • "enzyme-adapter-react-16": "^1.5.0"

언급URL : https://stackoverflow.com/questions/42430368/jest-spy-on-functionality

반응형