[JS]jestの使い方


なぜテストを行うのですか?


なぜテストするのですか?
簡単に考えれば、デバッグの手間を減らすためと言えるでしょう.
開発者は,コードを記述して開発するよりも,エラーによるデバッグを処理するのに要する時間が非常に多いことを知っているはずである.
このようなデバッグ時間を減らすことができれば、結果としてより速い開発速度も期待できるでしょう.
そのため、テストは開発過程の不可欠な一部である.
これは、作成した論理が正しい値をエクスポートしたかどうかを確認する必要があるからです.
では、テストとは何ですか.
実際、テストの1つは、コードを変更し、コンソールウィンドウまたはページに直接アクセスして検証することです.だから誰もがテストを知っていて、やっています.
しかし、このテストにはどんな欠点がありますか?時間がかかるこれは、変更を保存してページにアクセスし、直接ログインして投稿を作成するなど、多くのテストが必要だからです.
この手動テストはどうしても時間がかかり、かなり面倒です.そのため、JavaScriptにはJestのような多くのフレームワークがあり、これらの手動テストを自動的に実行するのに役立ちます.
もちろん、テストは完璧ではありません.しかし、テストを行うことで、アプリケーションが正常に動作しているかどうか、論理が正しいタスクを実行しているかどうかを証明することができ、より速い開発速度を期待することができます.😆
テストは、デバッグの作業量を削減し、開発を高速化するのに役立ちます.

Jest


JestはJavaScriptテストフレームワークの中で最も人気のあるフレームワークです.
Jestを使用して簡単な関数をテストしましょう.
$ yarn add jest -D

Jestをインストールしたら、スクリプトを設定します.
fn.jsファイルとfn.test.jsファイルを作成します.
ファイル名.test.js
ファイル名の次のテスト:jsを追加すると、jestは自動的に認識され、テストされます.

テスト演算関数


簡単な演算関数を作成し、テストしましょう.
// fn.js

function add(x, y) {
  return x + y;
}

module.exports = add
// fn.test.js
const add = require("./fn")

test("1 더하기 2는 3입니다.", () => {
  expect(add(1, 2)).toBe(3);
})

$ yarn test 

成功すると、上記の成功メッセージが表示されます.
簡単に説明すると、
testの最初のパラメータでは、テストの論理を説明し、テストするコードを記述するメッセージを書くことができます.
expectでは、テストする値(関数など)を作成し、予想した値を書くだけです.
現在作成されているコードはadd関数を用いて1と2の値を3と予測するテストコードである.
TOBeは値のみを比較する方法です.
予想値が配列またはオブジェクトの場合は、toContainやtoEqualなど、さまざまな方法が使用できます.

非同期関数のテスト


async、awaitを使用して非同期関数をテストします.
// fn.js
const func = {
    add: (x, y) => x + y,
    awaitPlease: () => {
        return new Promise((res) => {
            setTimeout(() => {
                res("jack");
            }, 1000);
        });
    },
};
module.exports = func;
2つの関数を結合し、awaitPleaseという関数をテストします.
次に、toBeではなくtoMatchを使用して文字列をチェックします.
まずasync、awaitを使わないとどうなりますか?
const func = require("./func.js");

test(...) // add 테스트

test("잭이 나타납니다.", () => {
    expect(func.awaitPlease()).toMatch("Jack");
});

上記の失敗メッセージが表示されます.これは、予想値と一致しないためです.
テストコードをasync awaitでパッケージしましょう.
...

test("잭이 나타납니다.", async () => {
    expect(await func.awaitPlease()).toMatch("Jack");
});

はい、今回は成功しました.

複数のテスト


非常に簡単な例を通してJestの試験方法を理解した.
ここでは、beforeEach、afterEach、describe、snapなどのテストをサポートする方法がいくつか用意されています.
直接文字で書くよりも、以下の動画を参考にしてみてください.😄
これは私が参考にしたビデオで、これはとても役に立つビデオだと思います.私は共有します.😎
  • Jestの詳細