Chutzpahを使ったTypeScriptのテストで困ったこと
VisualStudioでJavaScriptの単体テストもやってくれるようにするアドインのChutzpahですが
TypeScriptを使ったプロジェクトだといくつか困った問題が発生します。
こんなテストが有ったとします。
JavaScriptではなくTypeScriptで書いてます。
(この例だと分かりづらいですけど・・・)
/// <reference path="typings/jquery/jquery.d.ts" /> /// <reference path="typings/jasmine/jasmine.d.ts" /> describe("test_", () => { it("hoge", () => { spyOn($, "ajax").andCallFake( function (_) { var d = $.Deferred(); d.resolve([ { id: 1, name: "佐藤" }, { id: 2, name: "鈴木" } ]); return d.promise(); });; // なんかテスト }); });
これをテストエクスプローラで見ると
こんな感じで1つのテストが3つに見えてしまいます。
しかも1つは文字化けしてます。
1つは、WebEssentialsというアドインがTypeScriptをコンパイルした時に
生成されるminifyの方もテスト対象になってしまっているからです。
ASP.NET MVCの場合は、minifyは必要ないのでこれは生成されないように設定を変更します。
[ツール]→[オプション]から[Web Essentials]を選択し[Minify generated JavaScript]をfalseにします。
※既に出来てしまっているminifyファイルは削除してください。
もう1つが分かりにくかったのですが、Chutzpahは生成されたJavaScriptではなくTypeScriptでもテストが出来るようで
JavaScriptとTypeScriptのどちらもテストをしてしまっています。
これを設定でJavaScriptだけにします。(TypeScriptの方は文字化けしてしまっている方なので使いません)
[ツール]→[オプション]から[Chutzpah]を選択し[Testing Mode]をJavaScriptにします。
これで1つになりました。
実はもう1つ困ったことが起こるんです。
このテストを実行するとこんな感じでエラーになります。
$という変数が無いと言ってますね
TypeScript的な参照は1行目で行ってますが
生成されたJavaScriptにはjQueryのJavaScriptファイルがどこにあるのか分かりません。
jQueryのJavaScriptファイルを参照できるように1行目に追記します。
普通のrefernceだとコンパイルエラーになるので注意です。
/// <chutzpah_reference path="jquery-2.0.3.js" /> /// <reference path="typings/jquery/jquery.d.ts" /> /// <reference path="typings/jasmine/jasmine.d.ts" />
これでテストが成功します。