componenWillMount 내에서 실행되는 구성 요소 메소드를 테스트 할 수 없습니다.

Question

App이라는 구성 요소가 있으며이 구성 요소 내에 fetchContent이라는 메서드가 있습니다. 이 메서드는 내 componentWillMount 메서드 내에서 호출되며 구성 요소를 탑재 할 때 실제로 호출되는지 확인하려고합니다. 아래는 내 방법입니다 :

볼 수 있듯이, 화살표 함수를 사용하여 내 생성자의 구성 요소에 바인딩하는 대신 사용하고 있습니다. 클릭 이벤트라는 메서드이기 때문에 바인딩해야합니다. 그러나

, 나는이 구성 요소에 내 단위 테스트를 실행하려고 할 때 말에서 오류가 발생하기 때문에, 나는 일을 내 스파이/스텁을 얻을 수 없습니다 아래

TypeError: Attempted to wrap undefined property fetchContent as function

내 단위 테스트 :

it('should fetch the content when component mounts',() => { 
    sinon.spy(App.prototype, 'fetchContent'); 
    wrapper = mount(<App />); 
    expect(wrapper.instance().fetchContent).to.have.been.calledOnce; 
}); 

그러나 내 메서드가 바인딩되어 있지 않거나 화살표 함수를 사용하지 않는 경우 제대로 작동합니다.

아이디어를 얻는 방법은 무엇입니까?

Answer 1

그럼 스텁을 얻지 못하는 이유에 대한 귀하의 실제 질문에 대답하지 않도록 stackoverflow에 50 명의 담당자가 필요합니다.

어쨌든, 그 상황에서, 내가 너라면, 실제 구현을 스텁하지는 않지만 그 속성이 무엇인지 테스트 해 보겠다.

그래서 예 fetchContent 경우이 같은 뭔가를했다 :

fetchContent = (current) => { 
    this.setState({foo: current}); 
} 

내가 그 state.foo을 테스트 할 것입니다 당신이 fetchContent 때 구성 요소 마운트 전달 무엇 있습니다. 목표는 반드시 적절한 함수 호출은 다른 함수의 부작용으로 발생 할 경우

Answer 2

, 나는 이런 식으로 접근 좋아 :

const wrapper = shallow(<App />) 
const component = wrapper.instance() 

// either 
sinon.spy(component, 'fetchContent'); 
expect(wrapper.instance().fetchContent).to.have.been.calledOnce; 

// or 
const restore   = component.fetchContent 
component.fetchContent = jest.fn() 
const mock    = component.fetchContent 

component.componentWillMount() 

expect(mock).toHaveBeenCalled() 
container.fetchContent = restore 

을 대신 enzyme.mount를 사용하는, 당신은 단지의 부작용을 테스트 할 수 있습니다 componentWillMount과 신뢰를 통해 자신의 직업 발사 라이프 사이클 방법을 적절하게 수행하십시오.