2016-10-18 27 views
1

単体テスト(私は知っている、私は知っている、悪いengi、クッキーなし)なしで書いたレガシーコードを持っていますが、私たちは急いでおり、文字通り数日で立ち上がるサイトが必要でした。酵素/反応/ Redux - 不変の違反。

私は技術的負債を返済しようとしています。ほとんどの場合は簡単ですが、まだ反応コンポーネントをテストする必要があります。 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); 

答えて

2

reduxifyにラップされたクラスをテストにインポートしています。このコンポーネントはコンテキストを介してredux storeを渡すことを期待しているので、表示されているエラーはこれが当てはまらないことを警告しています。

あなたはダミーストアを提供し、またはreduxifyラッパーなしで部品を輸入し、代わりにそのコンポーネントをテストするためにcontextを模擬できます

// 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({}); 
    }); 
}); 

・ホープ、このことができます。

+2

はい、これはまさにそれであり、私は自分自身を考えなかったとは思えません。私は実際にこの正確なことを考えていることを覚えていますが、寝る直前に、忘れてしまいました。 おそらく情報が多すぎますが、ありがとうございます! –

関連する問題