Javascript単体テストフレームワークQUnitjs_javascriptスキルの詳細な紹介

WBOY

リリース： 2016-05-16 16:49:15

オリジナル

1424 人が閲覧しました

1. QUnit とは

QUnit (http://qunitjs.com/) は、コードのデバッグに役立つ非常に強力な JavaScript 単体テストフレームワークです。これは jQuery チームのメンバーによって作成され、jQuery の公式テストスイートです。ただし、通常の JavaScript コードをテストするには QUnit で十分であり、Rhino や V8 などの一部の JavaScript エンジンを通じてサーバーサイド JavaScript をテストできる場合もあります。
「単体テスト」の概念に慣れていなくても、心配する必要はありません。理解するのはそれほど難しくありません:

コードをコピーしますコードは次のとおりです:

コンピュータ プログラミングでは、単体テスト (また、モジュールテストと呼ばれる）は、プログラムモジュール（ソフトウェア設計の最小単位）が正しいかどうかを確認するテスト作業です。プログラム ユニットは、アプリケーションのテスト可能な最小のコンポーネントです。手続き型プログラミングでは、単位は単一のプログラム、関数、プロセスなどです。オブジェクト指向プログラミングでは、最小単位はメソッドであり、基本クラス (スーパークラス)、抽象クラス、または派生クラス (サブクラス) のメソッドが含まれます。 — ウィキペディアから引用。 

簡単に言うと、コードのすべての機能に対してテストを作成し、それらのテストがすべて合格すれば、コードに欠陥がないことを確認できます (通常は、テストがどの程度優れているかによって決まります) ）は徹底的に依存します）。

2. コードをテストする理由

これまでに単体テストを書いたことがない場合は、コードを Web サイトに直接アップロードし、しばらくクリックして問題があるかどうかを確認し、見つかった問題をこれを使用して解決してみてください。問題はたくさんあります。という方法で。
まず第一に、これは退屈です。すべてがクリックされていることを確認する必要があり、1 つまたは 2 つ見逃している可能性が高いため、クリックすることは実際には簡単な仕事ではありません。

第二に、テストのために行うことはすべて再利用可能ではありません。つまり、回帰するのが困難です。回帰とは何ですか?コードを作成してテストし、見つかった欠陥を修正してからリリースすると想像してください。この時点で、ユーザーは新しいバグに関するフィードバックを送信し、いくつかの新しい機能が必要になります。コードに戻り、これらの新しい欠陥を修正し、新しい機能を追加します。次に起こる可能性があるのは、古い欠陥が再び発生することです。これは「回帰」と呼ばれます。もう一度クリックする必要がありますが、これらの古いバグはまだ見つからない可能性が高く、たとえ見つかったとしても、問題の原因が回帰であることがわかるまでにはしばらく時間がかかるでしょう。単体テストでは、欠陥を見つけるためのテストを作成し、コードが変更されたら、テストを再度フィルタリングします。リグレッションが発生した場合、一部のテストは失敗しますが、それらを簡単に特定して、コードのどの部分にエラーが含まれているかを知ることができます。何を変更したかがわかったので、簡単に解決できます。

特に Web 開発における単体テストのもう 1 つの利点は、ブラウザ間の互換性テストが簡単になることです。テストケースを別のブラウザで実行し、1 つのブラウザで問題が発生した場合は、それを修正し、テストケースを再実行して、他のブラウザで問題が発生しないことを確認します。たとえば、すべてのターゲットブラウザがそれをサポートしています。

John Resig のプロジェクトについて言及したいと思います: TestSwarm(http://testswarm.com/)。分散型にすることで Javascript 単体テストを次のレベルに引き上げ、多くのテストケースを備えた Web サイトであり、誰でもそこにアクセスしていくつかのテストケースを実行でき、結果がサーバーに返されます。このようにして、コードはさまざまなブラウザーやさまざまなプラットフォームで非常に迅速にテストできます。

3. QUnit で単体テストを作成する方法

それでは、QUnit を使用して単体テストを正しく作成するにはどうすればよいでしょうか?まず、テスト環境をセットアップする必要があります:

コードをコピーしますコードは次のとおりです:

QUnit テストスイート

< ;script type="text/javascript" src="myTests.js">

QUnit テストスイート

記載されているように、ここでは被検査の QUnit フレームワークバージョンが使用されています。
被検査の代コードは myProject.js に追加されています。これらのテストを実行するには、これらのテストが完了するまでにこの HTML ファイルを開くだけで済みます。
承認は、事前に検査されたコードの返された結果です。事前に検査された場合は、承認されず、問題が発生したことがわかります。

运行肯定，你应该ハンドル它们放入测试案例：

复制代代码如下:

// この関数をテストしましょう
function isEven( val) {
return val % 2 === 0;
}
test('isEven()', function() {

ok(isEven(0), 'ゼロは偶数');
ok(isEven(2), 'つまり 2') ;
ok(isEven(-4), 'つまりマイナス 4 です');
ok(!isEven(1), '1 は偶数ではありません');
ok(!isEven(- 7), 'どちらもマイナス 7 ではありません');
})

ここでは、ある数字が奇数かどうかを検査するために使用される関数 isEven を定義しており、この関数が応答を返さないことを確認するためにこの関数を使用することを望んでいます。
最初に test() を使用します。建建1 つの検査パターンがあります。最初のパラメータは結果に表示される文字列で、2 番目のパラメータは私が削除した主を含む 1 つの回帰関数です。 2 番目のパラメータは、結果に表示されるメッセージに依存します。
ここで取得されるのは、テストの実行のみです。 🎜>

Javascript単体テストフレームワークQUnitjs_javascriptスキルの詳細な紹介四、深入学参考

以上のみ简单の介绍了 qunit.js 、その推奨方法も多、具体的に参照できる api 文档：http://api.qunitjs.com/