✓

node.js サポート

npm install

プロジェクトメンテナー

Chai-jQ

chai-jq は、Chai アサーションライブラリ用の代替プラグインで、jQuery 固有のアサーションを提供します。

使い方

chai-jq は、以下のパッケージマネージャでインストールできます。

NPM: npm install chai-jq
Bower: bower install chai-jq

統合に関する注意事項では、さまざまな環境（ブラウザ、AMD、Node.js）でプラグインを使用して Chai を適切にパッチする方法について説明しています。APIドキュメントは、テストで chai-jq アサーションを使用する方法を学ぶための良い出発点です。このサイト自体のテストスイートも、APIの簡単な紹介を提供しています。

アサーション

統合

chai-jq は、ブラウザ、AMD/RequireJS、および JsDom を使用した Node.js で動作します。

標準ブラウザ：標準の HTML ページで使用するには、Chai の後に chai-jq.js を含めます。

<script src="chai.js"></script>
<script src="chai-jq.js"></script>

AMD ブラウザ：RequireJS/AMD ページで使用するには、chai-jq で require し、テストのインポート/ランナーが開始される前に Chai にインジェクトします。

require(["chai", "chai-jq"], function (chai, plugin) {
  // Inject plugin.
  chai.use(plugin);

  // Rest of your test code here...
});

Node.js / JsDom：Node.js/JsDom で使用するには、chai-jq で require し、テストのインポート/ランナーが開始される前に Chai にインジェクトします。

var chai    = require("chai");
var plugin  = require("chai-jq");

// Inject plugin.
chai.use(plugin);

// Rest of test code here...

オブジェクトコンテキストの変更

chai-jq でのアサーションが Chai および他のプラグインと異なる点の1つは、特定のアサーション（現在）のオブジェクトコンテキストの切り替えです。

$attr
$prop

一般的な使用法では、テスト対象のオブジェクト（たとえば、expect() でラップされているもの）が現在のコンテキストのままなので、次のように記述できます。

var $elem = $("<div id=\"hi\" foo=\"bar time\" />");

expect($elem)
  // Assertion object is `$elem`
  .to.have.$attr("id", "hi").and
  // Assertion object is still `$elem`
  .to.contain.$attr("foo", "bar");

上記の例では、jQuery オブジェクト $elem は、両方の $attr 呼び出しでアサーション対象のオブジェクトのままです。ただし、上記で列挙したアサーションの特別なケースでは、

指定された期待アサーション値がない。そして、
チェーンで使用される否定（例：not）がない。

次に、アサーション対象のオブジェクトは、呼び出された実質的なメソッドの値に切り替わります。したがって、再び例を挙げ、期待値なしで $attr() を呼び出すと、次のようになります。

var $elem = $("<div id=\"hi\" foo=\"bar time\" />");

expect($elem)
  // Assertion object is `$elem`
  .to.have.$attr("foo").and
    // Assertion object now changed to `$attr()` value: `"bar time"`
    .to.equal("bar time").and
    .to.match(/^b/).and
    .to.not.have.length(2);

上の例では、アサーション対象のオブジェクトは、期待値なしで $attr("foo") を呼び出した直後に、文字列 "bar time" になります。

`$visible`

要素が表示されていることをアサートします。

Node.js/JsDom 注：JsDom は現在、ゼロサイズの要素または非表示の親要素を、適切に非表示/表示として推論しません。

expect($("<div>&nbsp;</div>"))
  .to.be.$visible;

参照：http://api.jquery.com/visible-selector/

`$hidden`

要素が非表示になっていることをアサートします。

Node.js/JsDom 注：JsDom は現在、ゼロサイズの要素または非表示の親要素を、適切に非表示/表示として推論しません。

expect($("<div style=\"display: none\" />"))
  .to.be.$hidden;

参照：http://api.jquery.com/hidden-selector/

`$val(expected, [message])`

expected (String|RegExp) 値
message (String) 失敗メッセージ（オプション）

要素の値が文字列または正規表現と一致することをアサートします。

expect($("<input value='foo' />"))
  .to.have.$val("foo").and
  .to.have.$val(/^foo/);

参照：http://api.jquery.com/val/

`$class(expected, [message])`

expected (String) クラス名
message (String) 失敗メッセージ（オプション）

要素にクラスの一致があることをアサートします。

expect($("<div class='foo bar' />"))
  .to.have.$class("foo").and
  .to.have.$class("bar");

参照：http://api.jquery.com/hasClass/

`$attr(name, [expected], [message])`

name (String) 属性名
expected (String) 属性の内容 (オプション)
message (String) 失敗メッセージ（オプション）
戻り値 現在のオブジェクトまたは属性文字列の値

ターゲットに指定された名前付き属性が正確にあることをアサートするか、include または contain 修飾子を使用する場合、ターゲットに属性のサブセットが含まれていることをアサートします。

expect($("<div id=\"hi\" foo=\"bar time\" />"))
  .to.have.$attr("id", "hi").and
  .to.contain.$attr("foo", "bar");

期待値が提供されない場合、コンテキストを属性文字列の値に変更します

expect($("<div id=\"hi\" foo=\"bar time\" />"))
  .to.have.$attr("foo").and
    .to.equal("bar time").and
    .to.match(/^b/);

参照：http://api.jquery.com/attr/

`$data(name, [expected], [message])`

name (String) data-attribute 名
expected (String) data-attribute の内容 (オプション)
message (String) 失敗メッセージ（オプション）
戻り値 現在のオブジェクトまたは属性文字列の値

ターゲットに指定された名前付きデータ属性が正確にあることをアサートするか、include または contain 修飾子を使用する場合、ターゲットにデータ属性のサブセットが含まれていることをアサートします。

expect($("<div data-id=\"hi\" data-foo=\"bar time\" />"))
  .to.have.$data("id", "hi").and
  .to.contain.$data("foo", "bar");

期待値が提供されない場合、コンテキストをデータ属性文字列の値に変更します

expect($("<div data-id=\"hi\" data-foo=\"bar time\" />"))
  .to.have.$data("foo").and
    .to.equal("bar time").and
    .to.match(/^b/);

参照：http://api.jquery.com/data/

`$prop(name, [expected], [message])`

name (String) プロパティ名
expected (Object) プロパティ値 (オプション)
message (String) 失敗メッセージ（オプション）
戻り値 現在のオブジェクトまたはプロパティ文字列の値

ターゲットに指定された名前付きプロパティが正確にあることをアサートします。

expect($("<input type=\"checkbox\" checked=\"checked\" />"))
  .to.have.$prop("checked", true).and
  .to.have.$prop("type", "checkbox");

期待値が提供されない場合、コンテキストをプロパティ文字列の値に変更します

expect($("<input type=\"checkbox\" checked=\"checked\" />"))
  .to.have.$prop("type").and
    .to.equal("checkbox").and
    .to.match(/^c.*x$/);

参照：http://api.jquery.com/prop/

`$html(expected, [message])`

expected (String) HTML コンテンツ
message (String) 失敗メッセージ（オプション）

ターゲットに指定された HTML が正確にあることをアサートするか、include または contain 修飾子を使用する場合、ターゲットに HTML のサブセットが含まれていることをアサートします。

expect($("<div><span>foo</span></div>"))
  .to.have.$html("<span>foo</span>").and
  .to.contain.$html("foo");

参照：http://api.jquery.com/html/

`$text(expected, [message])`

expected (String) テキストコンテンツ
message (String) 失敗メッセージ（オプション）

ターゲットに指定されたテキストが正確にあることをアサートするか、include または contain 修飾子を使用する場合、ターゲットにテキストのサブセットが含まれていることをアサートします。

expect($("<div><span>foo</span> bar</div>"))
  .to.have.$text("foo bar").and
  .to.contain.$text("foo");

参照：http://api.jquery.com/text/

`$css(expected, [message])`

expected (String) CSS プロパティの内容
message (String) 失敗メッセージ（オプション）

ターゲットに指定された CSS プロパティが正確にあることをアサートするか、include または contain 修飾子を使用する場合、ターゲットに CSS のサブセットが含まれていることをアサートします。

Node.js/JsDom 注：JsDom v0.8.8 の時点では、計算された CSS プロパティは正しく推論されません。明示的なものは完全に一致する必要があります。

ブラウザ注：明示的な CSS プロパティが（Node.js とは対照的に）一致しない場合があるため、プラグインは一致する明示的な style プロパティに対して追加のチェックを実行します。それでも、他の不確定なコーナーケースが存在する可能性があります。

PhantomJS 注：PhantomJS も CSS/スタイルに関して、特に明示的な style 属性ではなく CSS クラスから取得されるものに関して、かなり不安定で予測不可能です。

expect($("<div style=\"width: 50px; border: 1px dotted black;\" />"))
  .to.have.$css("width", "50px").and
  .to.have.$css("border-top-style", "dotted");

参照：http://api.jquery.com/css/

貢献

プラグインのヘルプ方法については、貢献ガイドをご覧ください。

すべての変更は Travis CI でテストし、内部テストカバレッジは Coveralls でレポートし、複雑さ/静的分析は Code Climate でチェックします。これが、ビルド、カバレッジ、および複雑さのステータスです。

Sauce Labs を使用して、フロントエンドコードのマルチブラウザテストも行っています。これがビルドマトリックスです。

ライセンス

このリポジトリには、他の人々のさまざまなライブラリが含まれており、次のようにライセンスされています。

jQuery は jQuery Foundation の著作物であり、MIT ライセンスの下でライセンスされています。
Mocha は TJ Holowaychuk の著作物であり、MIT ライセンスの下でライセンスされています。
Chai は Jake Luer の著作物であり、BSD ライセンスの下でライセンスされています。
Sinon.JS は Christian Johansen の著作物であり、BSD ライセンスの下でライセンスされています。
Mocha-PhantomJS は Ken Collins の著作物であり、MIT ライセンスの下でライセンスされています。
Pure は Yahoo! の著作物であり、MIT ライセンスの下でライセンスされています。