BT

最新技術を追い求めるデベロッパのための情報コミュニティ

寄稿

Topics

地域を選ぶ

InfoQ ホームページ ニュース Vest、新しいJavascriptフォームバリデーションフレームワーク

Vest、新しいJavascriptフォームバリデーションフレームワーク

原文(投稿日:2020/09/30)へのリンク

Vestは、フレームワークに依存しない新しいフォームバリデーションライブラリであり、MochaやJasmineと同様の単体テスト構文スタイルを使用しながら、バリデーションロジックを機能ロジックから分離する。

単純なフォームバリデーションの実装は簡単である。しかし、アプリケーションとフォームが複雑になると、バリデーションプロセスも複雑になり、コードの読み取りと保守が困難になることがよくある。

これらの課題に対処するために、ベストは最新の単体テストフレームワークの一般的な手法を採用した。バリデーションロジックは個別のファイルに用意し、開発者がJasmineまたはMochaで使用するものと同様の構文を使用する。これにより、必要に応じてバリデーションを理解、維持、およびリファクタリングすることが容易になる。

最新のフレームワークを使用して単体テストを作成する開発者は、Vestのコアコンセプトに精通している必要がある。バリデーションファイルは、フォームまたは機能の構造を反映する「spec」ファイルとまったく同じように動作する。

ただし、単体テストとは異なり、Vestバリデーションはプロダクション環境で実行され、コードベースから直接呼び出される。

Vestは、「test」キーワードを使用して、テスト対象を記述する。各テストには、実際のバリデーションを含む1つ以上の「enforce」関数が含まれている。これは、JasmineとMochaが「describe」関数と「it」関数を使用する方法とまったく同じように機能する。

Vestはあらゆるタイプの入力をバリデーションできるが、フォームのバリデーションに最も一般的に使用される。次の例には、3文字以上を必要とする「name」という単一のフィールドの検証が含まれている。

export default vest.create('formName', (data = {}, changedField) => {
  vest.only(changedField);

  test('name', 'Must be at least three chars long', () => {
    enforce(data.name.value)
      .longerThan(2);
  });
})

'test'関数は、フィールドの名前、返されるバリデーションエラー、そして最後にバリデーション関数の3つのプロパティを受け入れる。各「test」関数は単一のエラーメッセージを返すため、単一のenforce関数を含む複数のテストを使用することをお勧めする。

デフォルトでは、失敗したテストはエラーを返す。ただし、場合によっては、開発者はユーザに警告するだけでよい場合がある。これを実現するには、バリデーション関数内で「vest.warn()」を使用するだけである。

Vestは、エラーと警告の集計カウント、および各テストとグループの詳細情報を含む結果オブジェクトを返す。

完全なVestAPIは、公式Webサイトにある。これには、主要なJavaScriptフレームワークの短いチュートリアルと統合例も含まれている。

Vestは、MITライセンスの下で利用可能なオープンソースライブラリである。貢献とフィードバックはGitHubプロジェクトを通して奨励されており、Vest貢献ガイドラインに従う必要がある。

この記事に星をつける

おすすめ度
スタイル

BT