CoffeeScriptでAsyncTestCaseを書く #JavaScript

AsyncTestCaseとは

例えばajaxなどで応答を待って、その応答があってからその後のテストを行いたい場合にAsyncTestCaseを使います。自分の場合は、google maps apiのテストを行いたかったのですが、google maps apiのロードには少し時間がかかります。google maps apiのロードを待ってから、そのテストを行う場合のテストケースの書き方がわかったのでメモとして残しておきます。なおテストはCoffeescriptで記述してみます。

準備

google maps apiのロードは、<script>タグでapiを指定してもいいのですが、非同期によるテストを行いやすくするため、下記のgistを利用しました。

gist (GFoley83 / load-google-maps.js)

テストケースを書いてみる

test.coffee

$ ->
  AsyncTestCase "Google Maps API Test",
    "test sample": (queue) ->
      queue.call(
        "prepare google map"
        (callbacks) ->
          onReadyGoogleMap = callbacks.add(
            ->
              geocoder = new google.maps.Geocoder()
              assert(geocoder?)
          )

          $.when(
            loadGoogleMaps(3, null, "en", false)
          )
          .done(
            =>
              onReadyGoogleMap()
          )
      )

      queue.call(
        "next test"
        (callbacks) ->
          :
          :
      )

最初の $ -> は、こう書いておくとjQueryの準備ができるのを待ってからテストが行われるようになる。
非同期のテストはTestCaseのかわりにAsyncTestCaseを使う。
AsyncTestCaseでは各テストケースに引数を１つ指定する。ここではqueueという名前にしている。
queueはcallという関数を持っている。call関数は複数書くことでき、1つづつ順に実行される。callの中に書かれたテストが非同期のテストの場合、そのテストが終わるまで次のcallに書かれたテストは行われないという仕組みである。
callの第一引数はそのcallのテスト内容を示す任意の文字列、第二引数は引数callbacksを持つ関数オブジェクトである。
callbacksはadd関数を持っている。add関数の引数には何らかの非同期処理が完了した時に実行するテストケースなどを書いた関数オブジェクトを指定する。
add関数の戻り値も関数オブジェクトである。上の例ではonReadyGoogleMapである。ひとたびadd関数を実行すると、その戻り値であるonReadyGoogleMapが実行されるまで次のcall関数は実行されないようになる。
onReadyGoogleMapを$.whenのdoneで呼ぶようにする。上の例では、google maps apiが読み込み終わったら、onReadyGoogleMapが実行される。
onReadyGoogleMapを呼ぶと、callbacks.add()で指定したテストケースが実行される。

応用例

callbacks.add()の戻り値は、$.ajaxのdone()、setTimeout()などで指定することも可能。
setTimeout()との組み合わせでは、n秒待ってからテストということが可能になる。