Webアプリケーションテスト:Webサイトのテスト方法とは?種類

⚡ スマートサマリー

ウェブアプリケーションテストは、ウェブサイトの機能性、ユーザビリティ、インターフェース、データベース、互換性、パフォーマンス、セキュリティ、およびクラウドソーシングによる検証をリリース前に実施することで、有料ユーザーの目に触れる前にステージング環境で欠陥が明らかになるようにします。

  • 🧱 まずアーキテクチャを理解する: シングルページアプリケーション、マルチページアプリケーション、プログレッシブアプリケーションは、それぞれ異なるレイヤーにリスクを集中させる。
  • 🔗 機能性から始めましょう: ネガティブパスを含め、すべてのリンク、フォーム、Cookie、エンドツーエンドのワークフローが正しく動作することを証明します。
  • 甘いもの<XNUMXxXNUMX><XNUMXxXNUMX><XNUMXxAXNUMX><XNUMXxAXNUMX>️️ ブラウザとオペレーティングシステムを関連付ける: Chrome 全体でレンダリングが変化する、 Firefox、Safari、 Windows, macOS、そしてLinuxも含め、実際のトラフィック構成を網羅しましょう。
  • 静止状態ではなく、負荷がかかった状態で測定してください。 通常交通量におけるベースライン応答時間を測定し、その後、ピークを超える負荷をかけてブレークポイントを特定する。
  • 🔐 セキュリティ上の脆弱性を早期に解消する: 不正なページアクセスをブロックし、アイドル状態のセッションを期限切れにし、暗号化されたページを強制的に表示し、インジェクション攻撃の脆弱性をスキャンします。
  • 🔁 繰り返し行う作業は自動化し、それ以外の分野を探求しよう。 Script regression and cross-browser suites, reserve testers for usability judgement.

ウェブテストの種類についてさらに詳しく説明する前に、まずウェブテストの定義を簡単に説明し、それが開発サイクルの中でどのような位置づけになるのかを見ていきましょう。

Webアプリケーションテストとは何ですか?

Webアプリケーションのテストウェブサイトテストとは、ウェブアプリケーションやウェブサイトを公開して一般公開する前に、潜在的なバグがないかを確認する作業です。ウェブアプリケーションテストでは、ウェブアプリケーションやウェブサイトの機能性、使いやすさ、セキュリティ、互換性、パフォーマンスをチェックします。

During this stage, issues such as web application security, the functioning of the site, its access to handicapped as well as regular users, and its ability to handle traffic are checked.

ウェブサイトは単一のプログラムではありません。それはスタックです: HTML、CSS、そして Javaブラウザ内のスクリプトに加えて API and databases on the server. A layer that passes alone can still fail once it talks to its neighbour, so web testing needs complementary techniques.

Types of Web Applications You Need to Test

手法を選択する前に、まず目の前のアーキテクチャを把握しましょう。アーキテクチャの構造によって、不具合が集中する場所や、クライアントとサーバー間でどのようにリソースを配分するかが決まります。

Archi構造 どのように動作するか What this means for testing
シングルページアプリケーション(SPA) 一度読み込むと、ページ全体を再読み込みすることなく表示を更新します。 Gmail works this way. ほとんどのロジックはブラウザに渡されます。 Javaスクリプトの状態、動的レンダリング、およびクライアント側のセッション。
複数ページアプリケーション(MPA) Many pages reached through separate route URLサーバー側でレンダリングされる。ECサイトやニュースサイトでよく使われる。 ナビゲーションパスは増え続けるため、すべてのルート、フォーム、リダイレクトを最初から最後までテストしてください。
プログレッシブ ウェブ アプリ (PWA) サービスワーカー、マニフェスト、およびアプリシェルを使用して、ネイティブアプリのように動作します。 オフライン動作、古いキャッシュ、プッシュ通知、インストールプロンプトを追加します。

ほとんどの製品はこれらのパターンを組み合わせています。まずはどのパターンに該当するかを確認し、以下の8つのテクニックを試してみてください。

Web アプリケーションまたは Web サイトをテストする方法

ソフトウェア エンジニアリングでは、Web テストの要件に応じて、次のテスト タイプ/テクニックが実行される場合があります。

それぞれの手法は手動でもスクリプトでも実行可能であり、その選択によってコストはカバー範囲よりも高くなる。

側面 手動テスト 自動テスト
に最適 使いやすさと 探索 チェック 回帰テスト、クロスブラウザテスト、ロードラン
繰り返し走行時の速度 ゆっくりとした動き。努力はサイクルごとに繰り返される。 速い。この組曲はオンデマンドで再放送される。
コストプロファイル 最初は低いが、リリースごとに上昇する 初期費用が高く、その後スクリプトのメンテナンス費用が高くなります。

1. ウェブサイトの機能テスト

Web サイトの機能テスト ユーザー インターフェイス、API、データベース テスト、セキュリティ テスト、クライアントとサーバーのテスト、Web サイトの基本機能など、いくつかのテスト パラメーターが含まれるプロセスです。 機能テストは非常に便利で、ユーザーは手動テストと自動テストの両方を実行できます。 Web サイト上の各機能の機能をテストするために実行されます。

Webテスト活動には以下が含まれます。

ホイール試乗 リンク Web ページが正しく動作しているか、壊れたリンクがないことを確認してください。 チェックするリンクには次のものが含まれます –

  • 発信リンク
  • 内部リンク
  • Anchor リンク
  • Mailリンクへ

テストフォーム 期待どおりに動作しています。 これには以下が含まれます:

  • フォーム上のスクリプト チェックは期待どおりに機能しています。 たとえば、ユーザーがフォームの必須フィールドに入力しない場合、エラー メッセージが表示されます。
  • デフォルト値が入力されていることを確認する
  • 送信すると、フォームのデータはライブデータベースに送信され、有効なメールアドレスにリンクされます。
  • フォームは読みやすさを高めるために最適にフォーマットされています

テストクッキー 期待通りに動作しています。Cookieは、ウェブサイトが主にアクティブなユーザーセッションを記憶するために使用する小さなファイルです。そのため、ウェブサイトにアクセスするたびにログインする必要はありません。Cookieテストには以下が含まれます。

  • テスト Cookie (セッション) は、キャッシュがクリアされるか有効期限に達すると削除されます。
  • Cookie (セッション) を削除し、次回サイトにアクセスしたときにログイン資格情報が要求されるかどうかをテストします。

HTML と CSS をテストする 検索エンジンがサイトを簡単にクロールできるようにします。 これには以下が含まれます

  • 構文エラーのチェック
  • Readable カラースキーマ
  • 標準準拠。 W3C、OASIS、IETF、ISO、ECMA、WS-I などの標準に従っていることを確認します。

ビジネスワークフローのテスト– これには以下が含まれます

  • ユーザーが一連の Web ページを経由して完了する、エンドツーエンドのワークフロー/ビジネス シナリオをテストします。
  • ユーザーが予期しないステップを実行したときに適切なエラー メッセージやヘルプが Web アプリケーションに表示されるなど、否定的なシナリオもテストします。

使用できるツール: QTP , IBM 合理的な 、 Selenium

2. ユーザビリティテスト

ユーザビリティテスト 今やあらゆる Web ベースのプロジェクトの重要な部分となっています。 かもね テスターに​​よって実行される あなたのような または小規模なフォーカスグループ Web アプリケーションの対象ユーザーと同様です。

ホイール試乗 サイト ナビゲーション:

  • サイト上のメニュー、ボタン、またはさまざまなページへのリンクは、すべての Web ページで簡単に表示され、一貫している必要があります。

ホイール試乗   コンテンツ:

  • コンテンツは、スペルや文法上の誤りがなく、判読できる必要があります。
  • 画像が存在する場合は、「alt」テキストを含める必要があります

使用できるツール: チョークマーク, コンテンツスクエア、クリックスピー

3. インターフェースのテスト

機能と使いやすさが問題なければ、それらの背後にある各層が互いに連携していることを確認します。ここでテストすべき3つの領域は、アプリケーション、Web、データベースサーバーです。

  • 応用: テスト要求はデータベースに正しく送信され、クライアント側の出力は正しく表示されます。エラーがある場合は、アプリケーションによってキャッチされ、エンド ユーザーではなく管理者にのみ表示される必要があります。
  • ウェブサーバー: テスト Web サーバーは、サービスを拒否することなくすべてのアプリケーション要求を処理しています。
  • データベースサーバー: データベースに送信されたクエリが期待どおりの結果をもたらすことを確認してください。

テストシステムの応答 を特定いたします。 XNUMXつの層の間の接続 (アプリケーション、Web、データベース) 確立できない 適切なメッセージがエンド ユーザーに表示されます。

使用できるツール: ラノレックス

4. データベースのテスト

データベースは Web アプリケーションの重要なコンポーネントの XNUMX つであり、徹底的にテストするために重点を置く必要があります。 テスト活動には以下が含まれます:

  • クエリの実行中にエラーが表示されるかどうかをテストする
  • Rescale データ Integrity データベース内のデータを作成、更新、または削除するときに維持されます。
  • クエリの応答時間を確認し、必要に応じて微調整します。
  • データベースから取得したテスト データは Web アプリケーションに正確に表示されます

使用できるツール: QTP, Selenium

5. 互換性テスト

互換性テストは、Webアプリケーションがさまざまなデバイスで正しく表示され、正しく動作することを保証します。これには以下が含まれます。

ブラウザ互換性テスト: 同じウェブサイトでも、ブラウザによって表示が異なります。ウェブアプリケーションがブラウザ間で正しく表示されているかどうかをテストする必要があります。 Javaスクリプト、AJAX、認証は正常に動作しています。 モバイル ブラウザの互換性。

ボタンやテキストフィールドなどの Web 要素のレンダリングは、 オペレーティングシステム。ウェブサイトがさまざまな組み合わせで正常に動作することを確認してください。 Operaなどのティンシステム Windows、Linux、Mac、および次のようなブラウザ Firefox、Internet Explorer、Safariなど。

使用できるツール: Dynatrace

6. 性能試験

これにより、サイトがあらゆる負荷条件下で正常に動作することが保証されます。テスト活動には、以下が含まれますが、これらに限定されません。

  • さまざまな接続速度での Web サイト アプリケーションの応答時間
  • Web アプリケーションの負荷テストを行って、通常負荷およびピーク負荷時の動作を確認します。
  • Web サイトのストレス テストを行って、ピーク時に通常の負荷を超える負荷がかかったときのブレーク ポイントを判断します。
  • ピーク負荷によってクラッシュが発生したかどうか、そのようなイベントからサイトがどのように回復するかをテストします。
  • 読み込み時間を短縮するために、gzip 圧縮、ブラウザー、サーバー側のキャッシュなどの最適化手法が有効になっていることを確認してください。

使用できるツール: Loadrunner, JMeter

7. セキュリティテスト

セキュリティテスト は、クレジット カードなどの機密性の高い顧客情報を保存する電子商取引 Web サイトにとって不可欠です。 テスト活動には以下が含まれます:

  • 安全なページへのテスト不正アクセスは許可されるべきではありません
  • 制限されたファイルは、適切なアクセス権がなければダウンロードできません
  • ユーザーが長時間非アクティブになった後、チェックセッションが自動的に終了する
  • SSL 証明書を使用する場合、Web サイトは暗号化された SSL ページにリダイレクトする必要があります。

Intruder

Intruder は、Web アプリケーションや基盤となるインフラストラクチャに潜む多くの弱点を発見するのに役立つ強力な脆弱性スキャナーです。業界をリードするセキュリティチェック、継続的な監視、使いやすいプラットフォームを提供し、 Intruder あらゆる規模の企業をハッカーから守ります。

Intruder

特長

  • クラス最高の脅威をカバー 10,000件のセキュリティチェック
  • 構成の弱点、パッチの不足、アプリケーションの弱点 (SQL インジェクションやクロスサイト スクリプティングなど) などをチェックします。
  • スキャン結果の自動分析と優先順位付け
  • 直感的なインターフェイスで、最初のスキャンのセットアップと実行が簡単
  • 最新の脆弱性に対するプロアクティブなセキュリティ監視
  • AWS, Azure, Google Cloud コネクタ
  • CI/CD パイプラインとの API 統合

ロケーション選択 Intruder >>

8. 群衆テスト

本来であれば社内の少人数グループが行うはずだったテストを、大勢の人々(クラウド)に実行してもらうことになります。クラウドソーシングによるテストは、注目度が高く、今後発展が期待される概念であり、見過ごされがちな多くの欠陥の発見に役立ちます。

使用できるツール: クラウドテストプラットフォーム

Webアプリケーションテストプロセス:ステップバイステップ

8つの手法は、何をチェックすべきかを示しています。以下の手順は、それらをいつ実行すべきかを示しています。

  1. 要件を収集し、明確化する。 アプリケーションが実行すべきことと、その動作方法をリストアップします。曖昧な要件はテスト不可能な期待を生み出すため、まずそれらを解決します。このステップは、Webテストをより広い枠組みの中に位置づけるものです。 ソフトウェアテストのライフサイクル.
  2. テスト計画書を作成してください。 どの手法を適用するか、誰が実行するか、どのツールが必要か、そしてどのくらいの期間で実施するかを決定します。計画はロードマップであり、見積もりでもあります。
  3. テストケースを作成する。 各要件を、期待される結果を伴う具体的な手順に落とし込み、ユーザーが意図せず引き起こしてしまうような、理想的なシナリオとネガティブなシナリオの両方を網羅する。
  4. テスト環境をセットアップする。 予算が許す限り、できる限り忠実に再現する。つまり、同じブラウザとオペレーティングシステムの組み合わせ、同等のデータ量、現実的なネットワーク速度を使用する。
  5. テストを実行してください。 障害が再現可能なうちに、ケースを実行し、実際の結果と期待される結果を記録し、スクリーンショット、コンソール出力、サーバーログをキャプチャしてください。
  6. レポートと track個の欠陥。 再現手順と優先度を添えてそれぞれを記録し、修正後に再テストを行い、周辺で問題が発生していないことを確認してください。
  7. サイクルを閉じる。 テスト内容、発見事項、未解決事項、改善点などを網羅したテスト概要を作成し、リリース承認の署名を行う。

⚠️テストだけでなく、スケジュールも計画しましょう。 Webテストは骨の折れる作業であり、まず最初に直面する障害は締め切りのプレッシャーです。その後、度重なるコード変更によって完成した作業が無効になってしまうこともあります。ステップ2で各タスクを定義し、それに基づいて作業チャートを作成しましょう。

よくあるご質問

ウェブテストは、ブラウザとオペレーティングシステムの組み合わせ、レンダリング、およびサーバーとの往復通信を対象とする。 モバイルテスト デバイスのハードウェア、インストールおよびアップグレードの手順、通話、バッテリー消費、ジェスチャー、アプリストアのルールなどの割り込みを追加します。

ブラウザの互換性のばらつき、デバイスや画面サイズの多様性、ユーザーごとに変化する動的なページ、古い不具合を再発させる頻繁なリリース、そして短い納期。実際のトラフィックデータに基づいて優先順位を付け、回帰テストを自動化することで、作業範囲を管理しやすくすることができます。

AIは要件からテストケースを生成し、インターフェースが変更された際にロケーターを自己修復し、コミット後にどのテストスイートを実行するかを優先順位付けし、視覚的な差異を指摘します。 AIテストツール これを回帰テストやクロスブラウザテストに適用してください。

いいえ。 生成AIテストツール スクリプト作成や不具合トリアージのスピードアップには役立つが、ワークフローが分かりにくいかどうかを判断したり、ユーザーにとって何が重要かを判断したりすることはできない。ユーザビリティや探索的な判断は、依然として人間のテスターが担う。

Yes. アクセシビリティ テスト ユーザビリティ作業の一環として、キーボード操作、スクリーンリーダーの出力、色のコントラスト、代替テキストなどをWCAGに照らし合わせてチェックします。多くの市場では、これはオプションではなく、法的要件となっています。