ホームページ > ウェブフロントエンド > jsチュートリアル > Jest と Supertest を使用した REST API のテスト ✅

Jest と Supertest を使用した REST API のテスト ✅

Mary-Kate Olsen
リリース: 2024-12-28 20:36:11
オリジナル
474 人が閲覧しました

初出発行元: souvikinator.xyz

API エンドポイントの単体テストを設定する方法は次のとおりです。

次の NPM パッケージを使用します:

  • サーバー用の Express (他のフレームワークも使用可能)
  • 冗談
  • スーパーテスト

次を使用した VS Code 拡張機能:

  • 冗談
  • ジェスト・ランナー

依存関係のインストール

npm install express
ログイン後にコピー
npm install -D jest supertest
ログイン後にコピー

ディレクトリ構造は次のようになります:

Testing REST APIs using Jest and Supertest ✅

package.json も忘れないでください

{
  "name": "api-unit-testing",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "jest api.test.js",
    "start":"node server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.18.1"
  },
  "devDependencies": {
    "jest": "^28.1.2",
    "supertest": "^6.2.3"
  }
}
ログイン後にコピー

単純な Express サーバーの作成

/post エンドポイントで本文とタイトルを持つ POST リクエストを受け入れる Express サーバー。どちらかが欠けている場合、ステータス 400 Bad Request が返されます。

// app.js
const express = require("express");
const app = express();

app.use(express.json());

app.post("/post", (req, res) => {
  const { title, body } = req.body;

  if (!title || !body)
    return res.sendStatus(400).json({ error: "title and body is required" });

  return res.sendStatus(200);
});

module.exports = app;
ログイン後にコピー
const app = require("./app");
const port = 3000;

app.listen(port, () => {
  console.log(`http://localhost:${port} ?`);
});
ログイン後にコピー

Express アプリは、スーパーテストで使用するためにエクスポートされます。他の HTTP サーバー フレームワークでも同じことができます。

テストファイルの作成

// api.test.js
const supertest = require("supertest");
const app = require("./app"); // express app

describe("Creating post", () => {
    // test cases goes here
});
ログイン後にコピー

Supertest はサーバーの実行とリクエストの作成を担当し、私たちはテストに集中します。

Express アプリはスーパーテスト エージェントに渡され、Express をランダムな使用可能なポートにバインドします。次に、目的の API エンドポイントに HTTP リクエストを送信し、その応答ステータスを期待値と比較します。

 const response = await supertest.agent(app).post("/post").send({
        title: "Awesome post",
    body: "Awesome post body",
 });
ログイン後にコピー

3 つのケースのテストを作成します:

  1. タイトルと本文の両方が指定されている場合
  test("creating new post when both title and body are provided", async () => {
    const response = await supertest.agent(app).post("/post").send({
      title: "Awesome post",
      body: "Awesome post body",
    });

        // comparing response status code with expected status code
    expect(response.statusCode).toBe(200);
  });
ログイン後にコピー
  1. どちらかが欠けている場合
  test("creating new post when either of the data is not provided", async () => {
    const response = await supertest.agent(app).post("/post").send({
      title: "Awesome post",
    });

    expect(response.statusCode).toBe(400);
  });
ログイン後にコピー
  1. 両方とも欠けている場合
  test("creating new post when no data is not provided", async () => {
    const response = await supertest.agent(app).post("/post").send();

    expect(response.statusCode).toBe(400);
  });
ログイン後にコピー

そして最終的なコードは次のようになります:

const supertest = require("supertest");
const app = require("./app"); // express app

describe("Creating post", () => {

  test("creating new post when both title and body are provided", async () => {
    const response = await supertest.agent(app).post("/post").send({
      title: "Awesome post",
      body: "Awesome post body",
    });
    expect(response.statusCode).toBe(200);
  });

  test("creating new post when either of the data is not provided", async () => {
    const response = await supertest.agent(app).post("/post").send({
      title: "Awesome post",
    });
    expect(response.statusCode).toBe(400);
  });

  test("creating new post when no data is not provided", async () => {
    const response = await supertest.agent(app).post("/post").send();
    expect(response.statusCode).toBe(400);
  });
});
ログイン後にコピー

ランニングテスト

次のコマンドを使用してテストを実行します:

npm run test
ログイン後にコピー

Testing REST APIs using Jest and Supertest ✅

jest や jest Runner などの VS Code 拡張機能を使用している場合は、それが自動的に機能します。

Testing REST APIs using Jest and Supertest ✅

これが API エンドポイントを簡単にテストする方法です。 ?

Testing REST APIs using Jest and Supertest ✅

以上がJest と Supertest を使用した REST API のテスト ✅の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート