今日の参考コード https://codesandbox.io/s/142y8mpy73

以前作った条件分岐する関数をテストする

以前、以下のような関数を書きましたよね。この時は、わざわざ console.log() としないと確認できませんでした。

しかし、今の私たちにはテストがありますから、console.log() をして値を目視しなくても、関数が望んだ挙動になっているかどうかを 自動的に 確認することができます。

https://uncle-javascript.com/arrow-function-if-conditional-2

JavaScript
const check = strings => {
  if (strings === "月") {
    return "月です";
  }

  if (strings === "太陽") {
    return "太陽です";
  }

  return "月でも太陽でもありません";
};

const res = check("太陽");
console.log(res);

const res2 = check("月");
console.log(res2);

const res3 = check("火星");
console.log(res3);

関数のテストをかく

今回は、複数の test()describe() でまとめてましょう。

describe('名前', ()=> {}) で、各テストをまとめてあげます。

describe でテストをまとめる
describe("テストを大きくまとめた名前", () => {
  test("テスト1", () => {});
  test("テスト2", () => {});
});

実際のテストファイルは以下のようになります。

test.spec.js
const check = strings => {
  if (strings === "月") {
    return "月です";
  }

  if (strings === "太陽") {
    return "太陽です";
  }

  return "月でも太陽でもありません";
};

describe("惑星のチェック関数のテスト", () => {
  test("月の場合", () => {
    const res = check("月");
    expect(res).toEqual("月です");
  });

  test("太陽の場合", () => {
    const res = check("太陽");
    expect(res).toEqual("太陽です");
  });

  test("犬の場合", () => {
    const res = check("犬");
    expect(res).toEqual("月でも太陽でもありません");
  });

  test("数値の場合", () => {
    const res = check(100);
    expect(res).toEqual("月でも太陽でもありません");
  });
});

宿題

  • 以前自分が 寺子屋 8 で書いた条件分岐する関数を引っ張り出す
  • それに対してテストをする
  • テスト全体を describe() で囲ってみる。

以上です!