読者です 読者をやめる 読者になる 読者になる

【JS】テストコードを書き書き

JavaScript本格入門に少し飽きてきたので違う本を読んでます。

テスト駆動JavaScript

テスト駆動JavaScript

まだ本全体の趣旨があまり見えていないのですが…

第一章

第一章では自分でブラウザベースのテスト関数を作るところから始まって、出力をわかりやすくしたりテストケースをまとめて関数にしたりしながらテスティングフレームワークはこうあるべきだ!みたいなところを学んでいきます。JSはまとめるとすれば何らかの関数を作るしかないので、この辺を勉強するのにはいいかもしれません。

// テスト関数
function assert(message, expr) {
  // exprがfalseならエラー
  if (!expr) {
    throw new Error(message);
  }
  assert.count++;
  return true;
}
assert.count = 0;

// 結果を彩色してブラウザに渡す関数
function output (text, color) {
  var p = document.createElement("p");
  p.innerHTML = text;
  p.style.color = color;
  document.body.appendChild(p);
}

// テストケース関数
function testCase (name, tests) {
  assert.count = 0;
  var successful = 0;
  var testCount = 0;
  // setUp関数があるかどうかチェック
  var hasSetup = typeof tests.setUp == "function";
  // tearDown関数があるかどうかチェック
  var hasTeardown = typeof tests.tearDown == "function";
  for (var test in tests){
    // テストケースのフォーマットチェック
    // 'test'で始まらなければ実施しない
    if (!/^test/.test(test)) {
      continue;
    }

    testCount++;

    // テスト実施
    try{
      tests[test]();
      // エラー無く終了したら緑色でテストケース名を表示
      output(test, "#0c0");
      successful++;
    } catch(e){
      // 値が違っていた場合はテストケース名とエラーメッセージを赤字で表示
      output(test + "failed: " + e.message, "#c00");
    }
  }

  // トータル結果は、総テスト数と成功テスト数が同じなら緑、違えば赤で表示
  var color = successful == testCount ? "#0c0" : "#c00";
  output("<strong>" + testCount + " tests, " + (testCount - successful) + " failures</strong>", color);
}

結局は何らかのフレームワークを使うのですが笑

第二部はテストを書きながらJavaScriptの仕様を勉強していきます。
QUnitを使っていく予定です!