1

いくつかのアドホック React 要素コードの上に構築されたカスタム React 要素をテストしようとしています:

return (
    React.createElement("div", {className: classes},
        React.createElement(TextField, {  
            ref: "omniTextBox",
            className: "menu-textfield",
            onChange: this._onControlChange
        }),
    )
);

this._onControlChange は、テキスト フィールドの値に基づいて状態を操作します。それは私がテストしたいもので、テキストフィールドへの異なる入力がコンポーネントの異なる状態を引き起こします。

冗談コード:

var customComponent = TestUtils.renderIntoDocument( <CustomField /> );
var customField = TestUtils.findRenderedComponentWithType(customComponent, customField);
TestUtils.Simulate.change(customField, {target: {value: 'Hello, world'}});

_onControlChange の関数をモックして、呼び出されたかどうかを確認しようとしましたが、0回呼び出されました。また、simulate() 呼び出しの前後で customField var の状態を確認しようとしましたが、何も変わりません。テキストフィールドへの入力をシミュレートする何かが欠けているのだろうか

タグ、タイプ、クラスで選択するすべてのオプションを試しましたが、成功しませんでした。レンダリングされたコンポーネントを console.log にすると、textfield 要素が表示されます。ref を介して TextField のインスタンスを取得する方法はありますか?

4

1 に答える 1