検索
ホームページウェブフロントエンドjsチュートリアルCypress API テストをマスターする: 例を含む包括的なガイド

一般に API と呼ばれるアプリケーション プログラミング インターフェイスは、開発の観点だけでなくテストの観点からもソフトウェア開発ライフサイクルの重要な側面です。これらの API は、異なるシステム間の対話を促進してデータを交換します。したがって、これらの API を徹底的にテストして、アプリケーションがシームレスに機能することを確認することが非常に重要になります。

この記事では、Cypress Testing Framework を使用した API テストを検討し、効率的なテストのために API を自動化する方法を見ていきます。この記事では以下の点について説明します-

API テストの概要

API テストには、GET、POST、PUT、DELETE (またはその他のメソッド) の HTTP リクエストをバックエンド サーバーに送信し、応答を取得することが含まれます。応答が取得されると、期待された値が受信されたかどうかが検証されます。 API テストの重要な側面のいくつかを以下に示します

  • ステータス コードの検証 – 応答内のステータス コードの検証は、目的のステータス コードが受信されていることを確認するために行われます。たとえば、200 個のステータス コードがあれば確実に成功すると予想されます。 HTTP リクエストに使用される他の標準ステータス コードについては、Wiki ドキュメントから参照できます。
  • 応答本文のアサーション – XML または JSON に予期されたデータが含まれており、正しい構造であることを確認するための HTTP 応答本文の検証。
  • リクエスト パラメータのテスト – パラメータとヘッダーに異なる値を渡すことによる API の動作の検証。
  • 認証と認可 – 適切な認証メカニズムとセキュリティ面の検証。 API をテストする際、API のエンドツーエンド機能にバグがないことを確認するために、上記の点が考慮されます。

API テストに Cypress を利用する

Cypress は、ブラウザーとエンドツーエンドの自動テストに使用される、人気のあるフロントエンド テスト ツールです。 Cypress にはネットワーク リクエスト機能が備わっているため、API テストにも適しています。 API テスト用に Cypress が提供する主な機能の一部は次のとおりです-

  • 構文の理解 – UI テストと同様に、Cypress API コマンドは同じ .Should() および .then() 構文を使用します。
  • 組み込みアサーション – Cypress が提供するアサーションを簡単に使用して、ステータス コード、ヘッダー、さらには API リクエストの応答本文をアサートできます。
  • 失敗したリクエストの再試行 – サイプレスは、ネットワークまたは他の同様の問題がないことを確認するために、失敗したリクエストを自動的に再試行します。

精緻なドキュメント – サイプレスはリクエストとアサーションを適切に文書化しているため、実行中のサポートを受けることが容易になります。

Cypress API テストの主な機能

Cypress には、API テストを効果的かつ効率的に実行するのに役立つさまざまな機能が付属しています。いくつかの機能については以下で説明します -

  • cy.wait() – ネットワーク要求を待機するメカニズムを提供し、非同期データのロードを支援します。
  • cy.route() – テストリクエストを特定のハンドラーにルーティングするのに役立ちます。
  • cy.server() – は、テスト スイートのサーバー全体を維持するのに役立ちます。
  • テスト ランナー – テストの並行実行を支援し、所要時間を短縮します。
  • cy.login() – 呼び出しの前に 1 つのコマンドで認証ヘッダーを設定することで、安全な API リクエストを行うのに役立ちます。
  • cy.intercept() – 応答を制御するか、リクエストをインターセプトすることで動作をシミュレートします。 これらの機能を使用すると、ユーザーは強化された機能と効率的なフレームワークを使用して API テストの作成を開始することが非常に簡単かつ便利になります。

Cypress が API の自動化にどのように役立つかを理解したので、Cypress を使用して簡単な API テストを作成してみましょう。ただし、その前に、以下の前提条件が満たされていることを確認する必要があります-

  • Visual Studio などの IDE をインストールします (これが最もよく使用される IDE ですが、IntelliJ などの他の IDE を参照することもできます)
  • システムに Node.js をインストールします 次に、Cypress を使用して最初の API テストを作成する手順を見てみましょう。

Cypress を使用して最初の API テストを作成する

この記事では、GET、POST、PUT、および DELETE メソッドを使用して HTTP リクエストを送信する簡単なシナリオについて説明します。ただし、テスト スクリプトを書き始める前に、環境をセットアップします。

  1. システム内にローカルにフォルダーを作成します。システム内に CypressAPITests というフォルダーを作成しました。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

サイプレス API
2.次に、Visual Studio Code エディターを開き、手順 1 で作成したフォルダーを開きます。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

3 .フォルダーを開いたので、次のステップはノード プロジェクトを設定することです。これを行うには、ターミナルでコマンド npm init -y を使用します。これにより、package.json ファイルが作成されます。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

4 .まだインストールしていない場合は、npx cypress install コマンドを使用して、ターミナルから Cypress をインストールします。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

5 .ここで、テスト用の構成ファイルを作成します。そのために、ターミナルでコマンド npx cypress open を実行します。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

6 . Cypress ツールが開いたら、[E2E テスト] を選択します。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

7 .次の画面で [続行] をクリックします。

8 .構成ファイルのセットアップが完了したら、Visual Studio Code エディターに戻ると、構成ファイルが作成されたことがわかります。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

9 .これで、Cypress が正常にインストールされ、環境もすべて設定されました。これからテストの作成を開始します。

Cypress API オートメーションをデモするために、いくつかのダミー API 呼び出しを使用します。

Visual Studio Code エディターで、Cypress ディレクトリの下にフォルダー e2e を作成します。 e2e フォルダーの下に、APITests という名前で別のフォルダーを作成できます。要件に応じてフォルダー名を選択できることに注意してください。

ここで、最初のテスト ファイルの作成を開始します。 APITests フォルダーの下にファイルを作成します。これに HttpGetRequest という名前を付けます。以下のスナップショットに示すように、このファイル名には .cy.js という拡張子が付きます -

Mastering Cypress API Testing: A Comprehensive Guide with Examples
ここで、メインのコードを書き始めます。その前に、リクエストの基本的な構文を見てみましょう-

cy.request(METHOD,url,body)

Cypress を使用して作成されたリクエストでは、URL は必須パラメータですが、メソッドやボディなどの他のパラメータはオプションです。 Cypress の公式ドキュメントからさまざまなリクエスト構文を参照して、リクエスト構文の異なる使用方法をさらに理解してください。

このシナリオ例では、GET メソッドを使用してリソースを取得するため、メソッドと URL を cy.request のパラメーターとして使用します。

cy.request('GET','https://dummy.restapiexample.com/api/v1/employees')
このコマンドはサーバーへの API 呼び出しを行います。

次に、ステータス コードなどの応答値をアサートします。

.its('ステータス')
. should('equal',200);
このコード行は、応答ステータス コードを検証し、その値が 200 であることをアサートします。

このコードが結合されるとどのように見えるかを見てみましょう:

describe('HTTPGet',()=>{

it('GET リクエスト',()=>{

cy.request('GET','https://dummy.restapiexample.com/api/v1/employees')
.its('ステータス')
. should('equal',200);

})

})
GET リクエストのコードを書いた後、同じものを実行します。これを実行するには、次の 2 つの方法のいずれかを使用できます -

  1. ターミナルを介した実行
  2. Cypress ツールによる実行 どのように実行できるかを一つずつ見ていきます。

ターミナルを介した実行

ターミナル経由で Cypress コードを実行するには、ターミナル ウィンドウを開いて次のコマンドを渡すだけです。

npx cypress run –spec “filepath”

上記のコマンドのファイル パスは、実行するファイルの相対パスです。以下のスナップショットは、私のシステムでの HTTPGetRequest ファイルの実行を示しています-

Mastering Cypress API Testing: A Comprehensive Guide with Examples

テストの実行が成功し、API テストに合格したことがわかります。

Cypress ツールを使用して同じテストを実行してみましょう。

Cypress ツールによる実行

1 .コマンド npx cypress open を記述するだけでツールが開きます。

  1. ツール ウィンドウが開いたら、[E2E テスト] をクリックします。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

  1. 次に、任意のブラウザを選択します。私は電子を選択しています。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

  1. Electron ブラウザが開き、Visual Studio コードを記述した仕様が表示されていることがわかります。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

  1. HttpGetRequest を選択すると、実行が開始され、ログが表示されることがわかります。

Mastering Cypress API Testing: A Comprehensive Guide with Examples

これで、最初の Cypress API 自動化テストが実行されました。次に、他のいくつかの HTTP メソッドを実行できるようにコードを拡張します。

POST メソッド

POST HTTP リクエストを実行するコード -

describe('HTTPGet',()=>{

it('POST リクエスト',()=>{
cy.request({
メソッド: 'POST'、
URL: 'https://dummy.restapiexample.com/api/v1/create',
本文: {
"名前":"テスト投稿",
"給与":"1234",
"年齢":"23"

}
})
.its('ステータス')
. should('equal',200);
})
})
上記のコードを実行すると、以下に示すように実行結果がログに表示されます-

Mastering Cypress API Testing: A Comprehensive Guide with Examples
次のデモでは、別の偽の API コレクションを使用し、HTTP リクエスト メソッドがそれらに対してどのように機能するかを確認します。

PUT メソッド

PUT HTTP リクエストを実行するコード -

describe('HTTPPut',()=>{

it('PUT リクエスト',()=>{
cy.request({
メソッド: 'PUT'、
URL: 'https://jsonplaceholder.typicode.com/posts/1',
本文: {
ID: 1、
タイトル: 'これは PUT アップデートです',
body: 'これは PUT Update 本文です',
ユーザーID: 1,
}
})
.its('ステータス')
. should('equal',200) ;
})
})

上記のコードの実行結果は以下に表示されます-

Mastering Cypress API Testing: A Comprehensive Guide with Examples

DELETE メソッド

削除 HTTP リクエストを実行するコード (上で使用したのと同じ例に以下のコードを追加したことに注意してください)-

it('削除リクエスト',()=>{
cy.request({
メソッド: 'DELETE'、
URL: 'https://jsonplaceholder.typicode.com/posts/1',
})
.its('ステータス')
. should('equal',200) ;
})
PUT リクエストと DELETE リクエストの両方が同じファイル内にあったため、両方のメソッドが実行され、結果は以下のようになります-

Mastering Cypress API Testing: A Comprehensive Guide with Examples
これで、Cypress を使用してさまざまなメソッドの基本的な HTTP リクエストを実行する方法がわかりました。ここで、プロジェクトに Cypress API テストを実装して、短い所要時間で API をいかに簡単にテストできるかを確認してください。

結論

API と API テスト用の Cypress の基本を確認した後、以下の点について結論を出します。

  1. Cypress API Testing は、UI テスト用の Cypress の構文に慣れるための強力なツール セットを支援します。
  2. アサーションを便利に使用して、応答ステータス コードやその他の応答パラメータを検証できます。

出典: この記事はもともと testgrid.io で公開されました。

以上がCypress API テストをマスターする: 例を含む包括的なガイドの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
JavaScript、C、およびブラウザの関係JavaScript、C、およびブラウザの関係May 01, 2025 am 12:06 AM

はじめに私はあなたがそれを奇妙に思うかもしれないことを知っています、JavaScript、C、およびブラウザは正確に何をしなければなりませんか?彼らは無関係であるように見えますが、実際、彼らは現代のウェブ開発において非常に重要な役割を果たしています。今日は、これら3つの間の密接なつながりについて説明します。この記事を通して、JavaScriptがブラウザでどのように実行されるか、ブラウザエンジンでのCの役割、およびそれらが協力してWebページのレンダリングと相互作用を駆動する方法を学びます。私たちは皆、JavaScriptとブラウザの関係を知っています。 JavaScriptは、フロントエンド開発のコア言語です。ブラウザで直接実行され、Webページが鮮明で興味深いものになります。なぜJavascrを疑問に思ったことがありますか

node.jsは、型を使用してストリーミングしますnode.jsは、型を使用してストリーミングしますApr 30, 2025 am 08:22 AM

node.jsは、主にストリームのおかげで、効率的なI/Oで優れています。 ストリームはデータを段階的に処理し、メモリの過負荷を回避します。大きなファイル、ネットワークタスク、リアルタイムアプリケーションの場合。ストリームとTypeScriptのタイプの安全性を組み合わせることで、パワーが作成されます

Python vs. JavaScript:パフォーマンスと効率の考慮事項Python vs. JavaScript:パフォーマンスと効率の考慮事項Apr 30, 2025 am 12:08 AM

PythonとJavaScriptのパフォーマンスと効率の違いは、主に以下に反映されています。1)解釈された言語として、Pythonはゆっくりと実行されますが、開発効率が高く、迅速なプロトタイプ開発に適しています。 2)JavaScriptはブラウザ内の単一のスレッドに限定されていますが、マルチスレッドおよび非同期I/Oを使用してnode.jsのパフォーマンスを改善でき、両方とも実際のプロジェクトで利点があります。

JavaScriptの起源:その実装言語の調査JavaScriptの起源:その実装言語の調査Apr 29, 2025 am 12:51 AM

JavaScriptは1995年に発信され、Brandon Ikeによって作成され、言語をCに実現しました。 2。JavaScriptのメモリ管理とパフォーマンスの最適化は、C言語に依存しています。 3. C言語のクロスプラットフォーム機能は、さまざまなオペレーティングシステムでJavaScriptを効率的に実行するのに役立ちます。

舞台裏:JavaScriptをパワーする言語は何ですか?舞台裏:JavaScriptをパワーする言語は何ですか?Apr 28, 2025 am 12:01 AM

JavaScriptはブラウザとnode.js環境で実行され、JavaScriptエンジンに依存してコードを解析および実行します。 1)解析段階で抽象的構文ツリー(AST)を生成します。 2)ASTをコンパイル段階のバイトコードまたはマシンコードに変換します。 3)実行段階でコンパイルされたコードを実行します。

PythonとJavaScriptの未来:傾向と予測PythonとJavaScriptの未来:傾向と予測Apr 27, 2025 am 12:21 AM

PythonとJavaScriptの将来の傾向には、1。Pythonが科学コンピューティングの分野での位置を統合し、AI、2。JavaScriptはWebテクノロジーの開発を促進します。どちらもそれぞれのフィールドでアプリケーションシナリオを拡大し続け、パフォーマンスをより多くのブレークスルーを行います。

Python vs. JavaScript:開発環境とツールPython vs. JavaScript:開発環境とツールApr 26, 2025 am 12:09 AM

開発環境におけるPythonとJavaScriptの両方の選択が重要です。 1)Pythonの開発環境には、Pycharm、Jupyternotebook、Anacondaが含まれます。これらは、データサイエンスと迅速なプロトタイピングに適しています。 2)JavaScriptの開発環境には、フロントエンドおよびバックエンド開発に適したnode.js、vscode、およびwebpackが含まれます。プロジェクトのニーズに応じて適切なツールを選択すると、開発効率とプロジェクトの成功率が向上する可能性があります。

JavaScriptはCで書かれていますか?証拠を調べるJavaScriptはCで書かれていますか?証拠を調べるApr 25, 2025 am 12:15 AM

はい、JavaScriptのエンジンコアはCで記述されています。1)C言語は、JavaScriptエンジンの開発に適した効率的なパフォーマンスと基礎となる制御を提供します。 2)V8エンジンを例にとると、そのコアはCで記述され、Cの効率とオブジェクト指向の特性を組み合わせて書かれています。3)JavaScriptエンジンの作業原理には、解析、コンパイル、実行が含まれ、C言語はこれらのプロセスで重要な役割を果たします。

See all articles

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

このプロジェクトは osdn.net/projects/mingw に移行中です。引き続きそこでフォローしていただけます。 MinGW: GNU Compiler Collection (GCC) のネイティブ Windows ポートであり、ネイティブ Windows アプリケーションを構築するための自由に配布可能なインポート ライブラリとヘッダー ファイルであり、C99 機能をサポートする MSVC ランタイムの拡張機能が含まれています。すべての MinGW ソフトウェアは 64 ビット Windows プラットフォームで実行できます。

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

Dreamweaver Mac版

Dreamweaver Mac版

ビジュアル Web 開発ツール