Jestを使ってReact Hook Form + Yupのテストをする

17598 ワード

React Hook FormとYupを使ったフォームのテストをJestで書いてみました。

  • Reactを使ったフォームのレンダリングは行わずに、フォームのロジックのみをテストします。
  • フォームに値をセットして、フォーム送信時に使われる handleSubmit で出力される最終データをチェックします。
  • スキーマ定義によって出力データが意図しない結果になるバグがあり、コンパクトに検証するために作成したテストです。

testing-libraryのrenderHookを使って React Hook Form のフォームへのアクセスを得る

今回は Testing Libraryを使って React Hook のテストを行います。