web-dev-qa-db-ja.com

酵素でテストするときにReactフックを使用して機能コンポーネントの状態にアクセスする

EnzymeでuseStateフックを使用して機能コンポーネントの状態変化をテストする方法を考えていました。通常、テストはexpect(wrapper.state()).toEqual(expectedState)に沿ったものになりますが、エラーが発生します。

ReactWrapper::state() can only be called on class components

私はフックがまだアルファ段階にあり、shallowのようなものがまだ機能しないことを知っていますが、これを行う方法はまだあるのでしょうか？

reactjsenzymereact-hooks
17
avatarhzh

実装の詳細のテストは避けてください。代わりに、コンポーネントの動作が、状態を更新するアクションをトリガーしたときに期待どおりに動作するかどうかをテストします。

1
Daniel Afonso

コンポーネントの状態を制御すべきではないと思います。単体テストは制御入力と出力でなければなりません。

このような：

FormComponentにステータスプロップtrueを付与します。send-user-dataボタンが存在します。

Enyzmeのソースコードをチェックした場合 here 。インスタンスとクラスタイプのチェックを確認できます。機能コンポーネントnodeTypesがクラスに等しくなく、インスタンスがありません。

非同期要素の待機には https://github.com/etiennedi/enzyme-wait を使用できます。

あなたのテストはこのようにすることができます。

クリックイベントをシミュレート。send-user-dataボタン待機（その。setTimeout、promiseまたはxhr）し、返されたユーザーを期待します。

1
Erdogan Oksuz