2017-09-22 12 views
0

Jest를 사용하여 모의 객체를 생성하여 예상되는 인자로 함수 (React 컴포넌트로 전달 된 함수)가 호출되는지 테스트하려고합니다.React 컴포넌트에서 inside 블록이라고 불리는 함수를 조롱하십시오.

handlerFunction() { 

let response = []; 
this.props.files.forEach((file) => { 

    let responseObject= this.getResponse(file); 
    responseObject.then((result) => { 

    response.push({ 

     fileName: file.name, 
     records: result, 

    }); 

    this.props.sendResponseData(response); 

    }); 

}); 

} 

getResponse(file) { 

return new Promise((resolve, reject) => { 

    axios.post(URL, file).then((response) => { 

    resolve(response.data); 

    }).catch((error) => { 

    reject(console.error(error)); 

    }); 

}); 

} 

handlerFunction()하는 GetResponse()를 호출 AJAX를 호출을하고, 약속의 응답 데이터를 반환 아래

내가 테스트를 시도하고있는 기능입니다. handlerFunction()은 getResponse()에서 반환 된 응답 데이터를 가져와 응답 데이터와 해당 파일의 이름을 response []로 푸시 한 다음 this.props.sendResponseData()를 호출하여 응답을 보냅니다. getResponse()를 조롱하고 this.props.sendResponseData()가 테스트 클래스에서 만든 dummyResponse와 함께 호출되는 경우 더미 응답 데이터를 반환하고 테스트하도록했습니다. 다음과 같은 실패, 나는이 테스트를 실행하려고하면

it('handlerFunction',() => { 
files= [dummyFile]; 
sendResponseData = jest.fn(); 

let wrapper = shallow(<RenderComponent 
         files={files} 
         sendResponseData={sendResponseData} 
         />); 

let dummyAJAXResponse = {}; 
let dummyResponse = [{ fileName: 'file', records: dummyAJAXResponse }]; 

const getResponseMock= jest.fn(() => { 

return new Promise((resolve) => { 

    resolve(dummyAJAXResponse); 

}); 

}); 
wrapper.instance().getResponse= getResponseMock ; 
wrapper.update(); 
wrapper.instance().handlerFunction(); 
expect(sendResponseData).toBeCalledWith(dummyResponse); 
}) 

다음과 같이 말한다 : 여기

내가 반작용 구성 요소 위의 기능을 테스트하기 위해 작성한 코드입니다

expect(jest.fn()).toBeCalledWith(expected) 

Expected mock function to have been called with: 
    [[{"fileName": "file", "records": {}}]] 
But it was not called. 

도움을 주시면 대단히 감사하겠습니다. 감사!

답변

0

축약 전에 retrun을 추가하십시오.

return new Promise((resolve, reject) => { 

    return axios.post(URL, file).then((response) => { 

또는

return new Promise((resolve, reject) => (

    axios.post(URL, file).then((response) => { 
: 그런