효소/React/Redux - 불변의 위반.

Question

단위 테스트없이 작성한 일부 기존 코드가 있습니다 (나도 알아, 나쁜 engi, 쿠키 없음).하지만 우리는 서둘러서 며칠 만에 사이트가 필요했습니다.

이제 기술적 부채를 청산하려고합니다. 대부분은 쉽지만 반응 구성 요소를 테스트해야합니다. JSDom 효소 사용하여 그렇게하려고 노력하지만, 종종이 오류를 얻을 :

이

Invariant Violation: Could not find "store" in either the context or props of "Connect(ThankYou)". Either wrap the root component in a , or explicitly pass "store" as a prop to "Connect(ThankYou)".

그래서 내 질문은 : 어떤이 오류의 원인을, 나는이 문제를 어떻게 접근해야 하는가? 더 많은 질문이있을 것이라고 확신하지만, 지금은 큰 방해물입니다.

그래서, 여기에 시험의 설치는 다음과 같습니다

import React from 'react'; 
import chai from 'chai'; 
const expect = chai.expect; 
import { shallow, mount } from 'enzyme'; 

import ThankYou from '../src/frontend/js/containers/ThankYou'; 

describe('<ThankYou />',() => { 
    it('is trying to get React testing to work',() => { 
    const wrapper = shallow(<ThankYou />); 
    //(I know this test *will* fail, but it's failing in the wrong way.) 
    expect(wrapper).to.eql({}); 
    }); 
}); 

는 다음 구성 요소 자체입니다.

class ThankYou extends Component { 
    constructor(props){ 
    super(props); 
    } 

    render() { 
    return (
     <Paper zDepth={1} > 
     <div> 
      {thankYou.map((pgraph, i) => (<div key={"pg" + i}> 
      {pgraph[this.props.language]} 
      </div>))} 
     </div> 
     <Social /> 
     </Paper> 
    ); 
    } 
} 

// reduxify is a library I wrote which maps 
// state, actions, and dispatch to props. 
// source: https://github.com/brianboyko/reduxify/blob/master/reduxify.js 
export default reduxify(actions, ['language'], ThankYou); 

Answer 1

reduxify에 랩핑 된 클래스를 테스트로 가져옵니다. 이 구성 요소는 컨텍스트를 통해 redux store이 전달 될 것으로 예상하므로보고있는 오류는 그렇지 않을 것이라고 경고합니다.

당신은 더미 저장소를 제공하기 위해 context을 조롱 수, 또는 reduxify 래퍼없이 구성 요소를 가져 오는 대신 해당 구성 요소 테스트 :이 도움이

// Export the class before it becomes wrapped 
export class ThankYou extends Component { 
    ... 
} 

export default reduxify(actions, ['language'], ThankYou); 


// Update the test to import the basic class 
import { ThankYou } from '../src/frontend/js/containers/ThankYou'; 

describe('<ThankYou />',() => { 
    it('is trying to get React testing to work',() => { 
    const wrapper = shallow(<ThankYou />); 
    expect(wrapper).to.eql({}); 
    }); 
}); 

희망을.