Photo by Louis Reed on Unsplash
TL;DR: この記事では、最も需要の高い javascript テスト フレームワークのトップを見て、javascript の結果の状態からの洞察に基づいてそれらを検討します。
一般に、javascript アプリケーションをテストする方法には、基本的に 3 つのタイプまたは方法があります。 最初の方法は、期待される結果が生成されることを確認するために、入力がすでに知られている出力で提供される一種のブラックボックス方式によって、個々の機能を個別にまたは独立してテストすることで、これはユニット テストと呼ばれます。 次に、コンポーネントやアプリケーション全体をテストし、期待される結果が出力されるかどうかを確認するプロセスを統合テストと呼びます。 3つ目の方法は、ユーザーインターフェイステストとして知られており、基本的に内部動作にあまり重点を置かず、ブラウザを制御してアプリケーションをテストするために使用します。
StateOfJS
とは
State of JS は、基本的に JavaScript すべてに関する毎年の調査で、調査に参加した開発者の意見を記録し、美しく視覚化してその年の JavaScript の状態を意味する洞察を表示します。
データ ポイントは、フロントエンド Web 開発フレームワーク、データベース、状態管理、フレームワーク間の関係、レセプションと使いやすさ、JavaScript にコンパイルする言語、モバイル フレームワーク、ビルド ツール、JavaScript テスト ツール、その他多数に及んでいます。 2016年にSacha Greifと他の数人のヘルパーによって始められた非常に包括的なJavaScript調査であり、今では最新版で2万人以上の開発者の回答があります。
Why StateOfJS?
はい、State of JSは実は非常に最初の、JavaScriptコミュニティに関する限り普遍的に尊重されるJavaScriptのみの開発者調査なんですよ。 100,000 人以上の回答者がいる stackoverflow の開発者調査や、6,000 人以上の回答者がいる Jetbrain の開発者エコシステム状態レポートなど、他にも非常に人気のある調査がありますが、本日はこの state of js 調査に焦点を当てます。
state of javascript 2018サーベイで可視化された順に、これらのテストフレームワークを簡単に概観してみましょう。
ヒント: コンポーネント (React、ES6 など) を扱う場合、アプリ間で簡単に共有、整理、再利用するために Bit を使用します – より速く構築するためです。 また、コンポーネントを使用する前に、クラウドでコンポーネントを個別にテストするために使用することもできます。
Jest
Jest は、間違いなく最も人気のある javascript テスト フレームワークの 1 つで、github に 22,000 以上の ⭐️ が登録されており、Facebook のチームによって構築および維持されています。 Reactが推奨するゼロコンフィギュレーションのjavascriptテストフレームワークであり、最も使いやすいフレームワークです。 Jest は、2018 年に javascript コミュニティに非常に印象的に受け入れられた。
これは非常にパフォーマンスが高く、曖昧さのない便利なユーザーインターフェイスを持っています。 それはスパイとモックを同梱し、デフォルトでテスト グローバルを作成します。 また、スナップショットテストを提供し、組み込みのコードカバレッジツールを同梱しています。 信じられないほど高速で、JavaScriptコードのテストを始めたい初心者に最適な選択肢の一つです。
Mocha
Mocha は github で 16,000 以上の⭐️がついており、ここ数年最も使われている javascript のテストフレームワークです。 サードパーティのアサーションやモッキング、chai や enzyme のようなスパイツールと共に使用されます。 巨大なエコシステムに加え、Mocha にはよく確立されたオプションと素晴らしいドキュメントがあります。
Mocha から Jest に少し移行しつつありますが、Mocha は今でも最も使われているテストツールであり、最も頼りにされているライブラリで、JavaScript 開発者は Mocha を使うことで得られる自由度と柔軟性を理由にまだ手放さないようです。 Mocha コミュニティは非常に大規模で、使用法や使用例に関する膨大なリソースがあります。
Jasmine
Jasmine は Angular が開発者に使用を公式に推奨するテスト フレームワークとして広く知られており、Jest フレームワークは Jasmine に基づいて構築されています。 Jasmineはgithubに14,000以上の⭐️があり、javascriptをテストするための最も人気のあるフレームワークの1つで、最もリソースとコミュニティのサポートがある最も古いフレームワークの1つでもある。 Angularの公式ドキュメントでもJasmineを使うことが推奨されているので、Angularの開発者はJasmineを使いやすく、統合しやすいと感じることでしょう。 Jasmineは非常に簡単に始めることができ、これがJestにインスピレーションを与えたものの1つでしょう。 調査によると2018年には、JasmineからJestへの利用方法のシフトが見られ、また、angularと比較してjasmineでテストされるreactアプリケーションの数が増えているようです。
AngularアプリケーションのテストがJestで簡単に実行できることは非常に重要で、実質的には好みの問題でしかありません。
Karma
githubで1万以上の⭐️を持つKarmaは一種の一般用ケースjavascriptテストフレームワークです。 ブラウザやjsdomのようなブラウザライクな環境でテストを実行することができます。 travisやjenkinsのような継続的インテグレーションツールをサポートしており、テストは実際のデバイスやヘッドレスのphantomJsインスタンスで実行することができます。 フレームワークには依存しないので、Jasmine や Mocha でテストを記述したり、好きなフレームワーク用のシンプルなアダプタを書いたりできます。
テストは、ターミナルや IDE から、または BrowserStack などのサービスを使用してリモートで実行することも可能です。 AVA は Node.js 用のテストランナーで、簡潔な API、詳細なエラー出力、新しい言語機能の受け入れ、より効果的にテストを書くためのプロセスの分離を備えています。
スナップショットテストと typescript をサポートしており、ウォッチモードでテストを実行するので非常に高速です。 4042>
Cypress
github で 9,000 ⭐️ を超える Cypress は、非常に高速で信頼性の高い javascript テスト ツールです。 また、Mocha をサポートしており、ダッシュボードにテスト結果を記録し、簡単にデバッグできるとても良い方法を持っています。 4042>
Puppeteer
githubに43,000以上の⭐️があり、Googleのチームによって作られたPuppeteerはNodeライブラリで、DevToolsプロトコル上でChromeまたはChromiumを制御する高水準APIを提供する。 Puppeteer はデフォルトではヘッドレスで動作しますが、完全な (ヘッドレスではない) Chrome または Chromium を実行するように設定することができます。
テストシーンには新しいですが、すでに多くの開発者がそれを使用しています (Google ありがとう!)。
QUnit
github に 3,700 以上の ⭐️ がある QUnit は、もともと jQuery、jQuery UI および jQuery Mobile のテストのために開発された JavaScript ユニット テスト フレームワークですが、あらゆる JavaScript コードをテストする汎用フレームワークでもあります。 ウェブブラウザのクライアントサイド環境とサーバーサイドをサポートします。
QUnit は JUnit などの他のユニット テスト フレームワークと似ていますが、JavaScript が提供する機能を利用し、非同期性や例外処理のサポートなど、ブラウザでのコードのテストに役立ちます。
Chai
github で 6,000 ⭐️ の Chai は、Node の組み込み assert
に似た、振る舞い駆動開発およびテスト駆動開発のアサーション ライブラリです。 コードに対して実行できる多くのアサーションを提供することで、テストをより簡単にすることができます。
TestCafe
TestCafe は github で 5,900 以上の ⭐️ を獲得しており、エンドツーエンドの javascript アプリケーションテストに使われる node フレームワークである。
Windows、MacOS、および Linux を含むすべての一般的な環境で実行できます。 デスクトップ、モバイル、リモート、クラウドのブラウザー (UI またはヘッドレス) をサポートします。 また、非常に精巧なドキュメントと成長中のコミュニティがあります。
Honorable Mentions
Protractor
Conclusion