入門

以下のガイドでは、Node.js または ブラウザで QUnit を起動して実行する方法を説明します。

QUnit には依存関係がなく、Node.js、SpiderMonkey、およびすべての主要ブラウザをサポートしています。

Node.js で

Node.js プロジェクトで QUnit を使い始めるのは簡単です。まず、npm を使用して qunit パッケージをインストールします。

npm install --save-dev qunit

# Or, if using Yarn:
yarn add --dev qunit

テストできるサンプルプログラムを作成してみましょう！まず、2つの数値を加算する関数から始めます。add.js というファイルを作成し、次の内容を記述します。

function add (a, b) {
  return a + b;
}

module.exports = add;

次に、テストの作成を開始しましょう！例えば、test/add.js のようなテストディレクトリにファイルを作成し、次のように記述します。

const add = require('../add.js');

QUnit.module('add');

QUnit.test('two numbers', assert => {
  assert.equal(add(1, 2), 3);
});

これにより、2つの数値を加算した結果を検証する単一のテストケースを含む、「add」機能のテストスイートが定義されます。テストの整理方法やその他のアサーションの作成方法については、API ドキュメントの QUnit.test() ページを参照してください。

QUnit CLI を使用して最初のテストを実行できるようになりました。 npm スクリプトを使用して qunit コマンドを実行することを推奨します。これにより、npm がダウンロードした依存関係を保持するローカルの node_modules フォルダー内の qunit プログラムが自動的に検出されます。package.json ファイルで、次のように指定します。

{
  "scripts": {
    "test": "qunit"
  }
}

次に実行します

npm test

…すると QUnit がテストを実行します!

TAP version 13
ok 1 add > two numbers
1..1
# pass 1
# skip 0
# todo 0
# fail 0

おめでとうございます! これで最初の QUnit テストを作成して実行できました!

テストを整理したりアサーションを作成するための QUnit API については、API ドキュメントをご覧ください。

qunit コマンドのヘルプについては、コマンドラインインターフェースをご覧ください。

サポートポリシー

QUnit は、Node.js 長期サポート (LTS) スケジュールに従い、Current、Active LTS、および Maintenance LTS リリースをサポートします。

2.4.1 より前のパッケージ名

QUnit 2.4.1 より前は、npm パッケージは「qunit」ではなく「qunitjs」という名前で公開されていました。Node 用の以前のバージョンの QUnit をインストールするには、qunitjs を確認してください。

npm の「qunit」パッケージの 0.x および 1.x バージョンは、現在 node-qunit として公開されている別の CLI を保持しています。

Lint

eslint-plugin-qunit パッケージには、最適なテスト方法を実施したり、壊れたテストを検出したりするためのさまざまなルールが用意されています。

ブラウザで

ブラウザで QUnit を使い始めるには、test.html という単純な HTML ファイルを作成し、次のマークアップを含めます。

<!DOCTYPE html>
<meta charset="utf-8">
<title>Test Suite</title>
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.20.1.css">
<body>
  <div id="qunit"></div>
  <div id="qunit-fixture"></div>
  <script src="https://code.jquery.com/qunit/qunit-2.20.1.js"></script>
</body>

テストの作成を開始するために必要なマークアップはこれだけです。これは、jQuery CDNからライブラリをロードすることに注意してください。

ブラウザテストを自動化するために使用できる統合については、統合とダウンロードも参照してください。これらは通常、HTML ファイルも管理します。

次に、2つの数値を加算するサンプル add() 関数をテストする次のスクリプトを追加しましょう。

<script>
  function add(a, b) {
    return a + b;
  }

  QUnit.module('add', function() {
    QUnit.test('two numbers', function(assert) {
      assert.equal(add(1, 2), 3);
    });
  });
</script>

このコードは、add() 関数のテストモジュールを定義し、2つの数値を加算した結果を検証します。

これをブラウザで開くと、実行されたテストとそのアサーションの詳細なレポートが表示されます。また、開発中のフィルタリングや個々のテストの再実行など、さまざまなオプションも表示されます。このようになります。

おめでとうございます! これで最初の QUnit テストを作成して実行できました!

テストを整理したりアサーションを作成するための QUnit API の詳細については、API ドキュメントをご覧ください。

ブラウザサポート

QUnit は現在、次のブラウザをサポートしています。

Internet Explorer 6〜8、Opera 12+、または Safari 5+ などの古いブラウザについては、QUnit の 1.x シリーズを使用してください。

統合

次の統合を使用して、QUnit によるブラウザテストの実行を自動化できます。

サンプルプロジェクト

リリースチャネル

これらは、QUnit リリースで公式にサポートされているダウンロードチャネルです。

さらに読む