programing

Jest를 사용하여 거절된 약속을 어떻게 테스트합니까?

css3 2023. 4. 5. 22:08

Jest를 사용하여 거절된 약속을 어떻게 테스트합니까?

코드

import { createUser } from '../services';
...
...

handleFormSubmit = () => {  
  this.setState({ loading: true });
  createUser()
    .then(() => {
      this.setState({
        loading: false,
      });
    })
    .catch(e => {
       this.setState({
         error: e,
       });
    });
};

시험

 it('rejects...', () => {
    const Container = createUserContainer(CreateUser);
    const wrapper = shallow(<Container />);  

    return wrapper.instance().handleFormSubmit()
      .catch(e => {
         console.log("State: ", wrapper.state());
         expect(e).toEqual('error');
      });
 });

모의

export const createUser = function() {
  return new Promise((resolve, reject) => {
    reject('error');
  });
};

테스트에서는 메서드의 캐치에 코드가 강제로 들어갑니다.따라서 상태는 'error'로 설정됩니다.

하지만 내 테스트에서는 기대했던 대로 되지 않고 Promise가 거부될 때까지 기다렸다가 상태 변화를 테스트합니다.여기서 무엇을 시도해야 할지 잘 모르겠습니다. 비동기/대기 기능을 사용해야 합니까?

그래서...createUser대기하고 싶은 메서드입니다만, 실장하고 있는 경우는 허가할 수 없습니다.

다음과 같은 작업을 수행해야 합니다.

it('rejects...', () => {
  const Container = createUserContainer(CreateUser);
  const wrapper = shallow(<Container />);  
  return expect(wrapper.instance().handleFormSubmit()).rejects.toEqual('error');
});

이렇게 하면 더 깨끗할 것 같아요.이 접근방식은 공식 문서에서 확인할 수 있습니다.

주의할 점은.rejects(그리고.resolves)는 약속을 반환합니다.이 약속은 위의 예에서 반환되므로 joke가 약속을 기다리는 것을 알 수 있습니다.반품하지 않으면 기다려야 합니다.

it('rejects...', async () => {
  const Container = createUserContainer(CreateUser);
  const wrapper = shallow(<Container />); 
  await expect(wrapper.instance().handleFormSubmit()).rejects.toEqual('error');
});

대상이 비동기임을 인식하지 못하기 때문에 테스트가 실패합니다.를 사용하여 수정할 수 있습니다.done매개 변수 또는 테스트 함수 만들기async.

또한 캐치 브랜치가 실행되지 않더라도 테스트가 실패하도록 예상되는 어설션의 수를 설정해야 합니다.

async/await스타일:

 it('rejects...', async () => {
    expect.assertions(1);
    const Container = createUserContainer(CreateUser);
    const wrapper = shallow(<Container />); 

    await wrapper.instance().handleFormSubmit()
      .catch(e => {
         console.log("State: ", wrapper.state());
         expect(e).toEqual('error');
      });
 });

구식done파라미터:

 it('rejects...', done => {
    expect.assertions(1);
    const Container = createUserContainer(CreateUser);
    const wrapper = shallow(<Container />);  

    wrapper.instance().handleFormSubmit()
      .catch(e => {
         console.log("State: ", wrapper.state());
         expect(e).toEqual('error');
         done();
      });
 });

비동기 테스트레퍼런스

expects.예상사항 레퍼런스

코드가 맞는 것 같습니다.왜 프로미스가 거부될 때까지 기다리지 않는다고 말하는 거죠?내가 할 수 있는 유일한 차이는 Jest의 조롱하는 능력을 이용하는 것이다. 그러니 변화하라.

모의

export const createUser = function() {
  return new Promise((resolve, reject) => {
    reject('error');
  });
};

로.

시험

jest.mock('../services');
const services = require('../services');

const createUser = jest.spyOn(services, "createUser");
createUser.mockRejectedValue("error");

...

it('rejects...', () => {

별도의 모의 파일은 필요 없습니다.

고객님의 코드로handleFormSubmit테스트에서 대기할 수 있는 Promise가 반환됩니다.또한 약속을 해결하려면 성공과 오류 콜백에서 진실된 데이터를 반환해야 합니다.

handleFormSubmit = () => {  
  this.setState({ loading: true });
  return createUser()
    .then(() => {
      this.setState({
        loading: false,
      });
      return true;
    })
    .catch(e => {
       this.setState({
         error: e,
       });
       throw e;
    });
};

여기 실제 코드에서는 에러가 검출되었습니다.catch핸들러와 테스트 케이스 코드에 추가하려고 합니다.이런 이유로catch체인을 할 수 있는 동안 더 이상 체인을 할 수 없습니다.then여러 번.

참고로 Promise 문서를 참조하십시오.https://www.peterbe.com/plog/chainable-catches-in-a-promise

언급URL : https://stackoverflow.com/questions/50821835/how-do-i-properly-test-for-a-rejected-promise-using-jest