2016-03-30 1 views
2

私は冗談を使用している、と私は次のようにいくつかのコンポーネントを持っている:Reactコンポーネントをテストするとき、非ライフサイクルメソッドを直接呼び出す方法はありますか?

var TestClass = react.createClass({ 
    foo: function() { 
    return "test"; 
    }, 
    render: function() { 
    return <div />; 
    } 
}); 

そして、私が特にTestClassfooメソッドのユニットテストを書きたいです。

私はCall a React component method from outsideが、これは可能なはず提案したことを見た - 単にテストでコンポーネントをレンダリングし、それを呼び出す:

describe("TestClass", function() { 
    it("should access internal methods", function() { 
    var test = <TestClass /> 

    expect(test.foo()).toBeTruthy() 
    } 
}); 

その質問の答えから、私はこのテストに合格する期待が、代わりになります

test.fooは関数ではありません

は、私はその答えを誤解がありますか?

一般的に、この方法で非ライフサイクルメソッドをテストできる方が良いでしょう。これはより細かくなりますが、これが不可能な場合は正常な代替方法がありますか?

たとえば、メソッドがこの能力を持たないコンポーネントの子に渡されたメソッドをテストする方法はありますか?

+1

あなたのテストの変数 'test'は、クラスのインスタンスではなく、レンダリングされたコンポーネント(または' .renderIntoDocument'が返すもの)であると思います。 –

+0

これは、私がスタックオーバーフローのために考案した例を一緒に打つことで得られるものです! – ttrmw

+0

'expect(TestClass.prototype.foo())を編集します。toBeTruthy();' –

答えて

0

使用renderIntoDocumentは:

import ReactTestUtils from 'react-addons-test-utils'; 

... 

const test = ReactTestUtils.renderIntoDocument(
    <TestClass /> 
); 
expect(test.foo()).toBeTruthy(); 
+0

ドキュメントが定義されていません...これはブラウザでのみ機能します。 :\ –

+0

修正 - すべての後にReactTestUtilsのrenderIntoDocumentを使用しています。 – Anuj

0

あなたの代わりにReactTestUtilsの酵素を使用している、とあなたは、酵素のマウントレンダラを使用している場合は、ReactComponentを取得するために、ReactWrapperに.instance()を呼び出すことができます。

関連する問題