概要

単一のウェブページをロードする際、ブラウザはページに表示される様々なリソースを取得するために、多くのネットワーク呼び出しを異なるURLに対して行う必要があります。ブラウザが特定のURLへのリクエストを行っているかどうかを確認したい場合や、ウェブサイトのロード中にブラウザが行っているすべてのネットワーク呼び出しを収集したい場合があります。

ブラウザの開発ツールにある「ネットワーク」タブに移動して、行われたすべてのネットワーク呼び出しを確認することもできますが、簡単で自動化された方法があります。

Selenium 4で利用可能になったChrome DevTools Protocolのサポートにより、Nightwatchはウェブサイトのロード中に発生するすべてのネットワーク呼び出しをキャプチャできるようになりました。

このコマンドは、Google ChromeやMicrosoft EdgeなどのChromiumベースのブラウザでのみ機能します。

ネットワーク呼び出しのキャプチャ

このコマンドを使用すると、ウェブサイトのロード中に実行されるすべてのネットワーク呼び出しをキャプチャし、ユーザーが提供したコールバック関数を引数としてネットワーク呼び出しパラメータと共にテスト実行自体に送り返すことができます。

必要なのは、ウェブサイトに移動する前に、必要なパラメータを指定してbrowser.captureNetworkRequests()コマンドを呼び出すだけです。

captureNetworkRequests()はコールバック関数を受け付けます。この関数は、ブラウザによってネットワーク呼び出しが行われるたびに、requestParamsオブジェクトを引数として受け取ります。受け取ったrequestParamsで使用可能なすべてのプロパティはこちらにあります。重要なプロパティをいくつか示します。

名前 タイプ 説明
タイムスタンプ 番号 ネットワーク呼び出しが行われた時刻。
リクエスト
オブジェクト requestオブジェクトには、URL、使用されたHTTPメソッド、HTTPヘッダーなど、行われたネットワーク呼び出しに関する重要な詳細がすべて含まれています。
requestオブジェクトで使用可能なすべてのプロパティはこちらから参照できます。

tests/capture-network-calls.js
describe('capture network requests', function() {
  it('captures and logs network requests as they occur', function() {
    this.requestCount = 1;
    browser
      .captureNetworkRequests((requestParams) => {
        console.log('Request Number:', this.requestCount++);
        console.log('Request URL:', requestParams.request.url);
        console.log('Request method:', requestParams.request.method);
        console.log('Request headers:', requestParams.request.headers);
      })
      .navigateTo('https://www.google.com');
  });
});

上記の例のネットワーク呼び出しの出力例

  Running Capture network calls:
───────────────────────────────────────────────────────────────────────────────────────────────────
Request Number: 35
Request URL: https://www.google.com/favicon.ico
Request method: GET
Request headers: {
  'sec-ch-ua': '" Not A;Brand";v="99", "Chromium";v="102", "Google Chrome";v="102"',
  'sec-ch-ua-full-version-list': '" Not A;Brand";v="99.0.0.0", "Chromium";v="102.0.5005.61", "Google Chrome";v="102.0.5005.61"',
  'sec-ch-ua-mobile': '?0',
  'User-Agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.5005.61 Safari/537.36',
  'sec-ch-ua-arch': '"x86"',
  'sec-ch-viewport-width': '1200',
  'sec-ch-ua-full-version': '"102.0.5005.61"',
  'sec-ch-ua-platform-version': '"12.1.0"',
  Referer: 'https://www.google.com/',
  'sec-ch-dpr': '2',
  'sec-ch-ua-bitness': '"64"',
  'sec-ch-ua-wow64': '?0',
  'sec-ch-ua-model': '',
  'sec-ch-ua-platform': '"macOS"'
}