2017-10-03 4 views
2

Mobx 삽입 및 농담으로 구성 요소를 테스트하는 데 문제가 있습니다.테스트 Mobx 주입 구성 요소

describe('TestContainer',() => { 
it('knows that 2 and 2 make 4',() => { 
    const wrapper = shallow(<TestContainer mainStore={{}} />); 
    expect(wrapper.instance().sum(2,2)).toBe(4); 
}); 
}); 

난이 오류 받고 있어요 :

@inject("mainStore") @observer 
export default class TestContainer extends React.Component { 
    sum(a, b) { 
     return a + b; 
    } 
    render() { 
     return <div className="TestContainer">phhhaz</div> 
    } 
} 

이것은 테스트입니다 : 이 구성 요소입니다

TypeError: wrapper.instance(...).sum is not a function 

난이 일어나는 이유를 알고를하지만 난하지 않습니다 그것을 해결하는 방법을 알아라.

+0

'얕은'대신 '마운트'를 시도해 보셨습니까? – Tholle

+0

예. 했어 ... 오류 : 글로벌 문서를로드하지 않고 'mount()'를 호출 한 것 같습니다. –

+0

[** jsdom **] (https://github.com/airbnb/enzyme/blob/master/docs/guides/jsdom.md)와 같은 헤드리스 브라우저를 사용할 수 있습니다. – Tholle

답변

2

문제는 사용자가 주사 구성 요소를 얕게 렌더링한다는 것입니다. 그리고 랩핑 컴포넌트 (Hoc)이기 때문에 자신의 컴포넌트를 전혀 테스트하지 않습니다. TestContainer을 렌더링하고 테스트하는 대신 TestContainer.wrappedComponent을 렌더링하고 테스트해야합니다. 자세한 내용은 다음을 참조하십시오 : https://github.com/mobxjs/mobx-react#testing-store-injection

관련 문제