分度器-分度器とSeleniumサーバー

前に説明したように、Protractorは、AngularおよびAngularJSアプリケーション向けのオープンソースのエンドツーエンドのテストフレームワークです。Node.jsプログラムです。一方、Seleniumは、Seleniumサーバー、WebDriver API、およびWebDriverブラウザードライバーを含むブラウザー自動化フレームワークです。

Seleniumを使用した分度器

ProtractorとSeleniumの組み合わせについて説明すると、ProtractorはSeleniumサーバーと連携して、自動テストインフラストラクチャを提供できます。インフラストラクチャは、ブラウザーまたはモバイルデバイスで実行されているAngularアプリケーションとのユーザーの対話をシミュレートできます。次の図に示すように、分度器とSeleniumの接続詞は、テスト、サーバー、ブラウザーの3つのパーティションに分割できます。

SeleniumWebDriverプロセス

上の図で見たように、Selenium WebDriverを使用したテストには、次の3つのプロセスが含まれます。

  • テストスクリプト
  • サーバー
  • ブラウザ

このセクションでは、これら3つのプロセス間の通信について説明します。

テストスクリプトとサーバー間の通信

最初の2つのプロセス(テストスクリプトとサーバー)間の通信は、Seleniumサーバーの動作に依存します。言い換えれば、Seleniumサーバーの実行方法によって、テストスクリプトとサーバー間の通信プロセスが形作られると言えます。

Seleniumサーバーは、スタンドアロンのSeleniumサーバー(selenium-server-standalone.jar)としてマシン上でローカルに実行することも、サービス(Sauce Labs)を介してリモートで実行することもできます。スタンドアロンのSeleniumサーバーの場合、Node.jsとseleniumサーバーの間にhttp通信があります。

サーバーとブラウザ間の通信

サーバーは、テストスクリプトからコマンドを解釈した後、ブラウザにコマンドを転送する責任があることを知っています。そのため、サーバーとブラウザにも通信媒体が必要であり、ここでは通信はJSON WebDriver Wire Protocol。コマンドの解釈に使用されるブラウザードライバーで拡張されたブラウザー。

Selenium WebDriverプロセスとその通信に関する上記の概念は、次の図を使用して理解できます。

Protractorを使用している間、最初のプロセスであるテストスクリプトはNode.jsを使用して実行されますが、ブラウザーでアクションを実行する前に、テスト対象のアプリケーションが安定していることを確認するための追加コマンドを送信します。

Seleniumサーバーのセットアップ

Selenium Serverは、テストスクリプトとブラウザードライバーの間のプロキシサーバーのように機能します。基本的に、コマンドをテストスクリプトからWebDriverに転送し、WebDriverからの応答をテストスクリプトに返します。Seleniumサーバーをセットアップするための以下のオプションが含まれています。conf.js テストスクリプトのファイル-

スタンドアロンSeleniumサーバー

ローカルマシンでサーバーを実行する場合は、スタンドアロンのセレンサーバーをインストールする必要があります。スタンドアロンのSeleniumサーバーをインストールするための前提条件は、JDK(Java Development Kit)です。ローカルマシンにJDKをインストールする必要があります。コマンドラインから次のコマンドを実行することで確認できます-

java -version

これで、SeleniumServerを手動またはテストスクリプトからインストールして起動するオプションがあります。

Seleniumサーバーを手動でインストールして起動する

Seleniumサーバーを手動でインストールして起動するには、Protractorに付属のWebDriver-Managerコマンドラインツールを使用する必要があります。Seleniumサーバーをインストールして起動する手順は次のとおりです。

Step 1−最初のステップは、SeleniumサーバーとChromeDriverをインストールすることです。次のコマンドを実行することで実行できます-

webdriver-manager update

Step 2−次に、サーバーを起動する必要があります。次のコマンドを実行することで実行できます-

webdriver-manager start

Step 3−最後に、構成ファイルのseleniumAddressを実行中のサーバーのアドレスに設定する必要があります。デフォルトのアドレスはhttp://localhost:4444/wd/hub

テストスクリプトからSeleniumサーバーを起動する

テストスクリプトからSeleniumサーバーを起動するには、構成ファイルで次のオプションを設定する必要があります-

  • Location of jar file − seleniumServerJarを設定して、構成ファイルでスタンドアロンSeleniumサーバーのjarファイルの場所を設定する必要があります。

  • Specifying the port−スタンドアロンのSeleniumサーバーを起動するために使用するポートも指定する必要があります。seleniumPortを設定することで設定ファイルで指定できます。デフォルトのポートは4444です。

  • Array of command line options−サーバーに渡すコマンドラインオプションの配列も設定する必要があります。seleniumArgsを設定することで設定ファイルで指定できます。コマンドの配列の完全なリストが必要な場合は、次のコマンドでサーバーを起動します。-help 国旗。

リモートSeleniumサーバーの操作

テストを実行するためのもう1つのオプションは、Seleniumサーバーをリモートで使用することです。サーバーをリモートで使用するための前提条件は、サーバーをホストするサービスのアカウントを持っている必要があることです。分度器を使用している間、サーバーをホストする次のサービスのサポートが組み込まれています-

TestObject

TestObjectをリモートSeleniumサーバーとして使用するには、TestObjectアカウントのユーザー名であるtestobjectUserと、TestObjectアカウントのAPIキーであるtestobjectKeyを設定する必要があります。

BrowserStack

BrowserStackをリモートSeleniumサーバーとして使用するには、BrowserStackアカウントのユーザー名であるbrowserstackUserと、BrowserStackアカウントのAPIキーであるbrowserstackKeyを設定する必要があります。

ソースラボ

SauceLabsをリモートSeleniumServerとして使用するには、Sauce Labsアカウントのユーザー名であるsauceUserと、SauceLabsアカウントのAPIキーであるSauceKeyを設定する必要があります。

コビトン

KobitonをリモートSeleniumサーバーとして使用するには、Kobitonアカウントのユーザー名であるkobitonUserと、KobitonアカウントのAPIキーであるkobitonKeyを設定する必要があります。

Seleniumサーバーを使用せずにブラウザードライバーに直接接続する

テストを実行するためのもう1つのオプションは、Seleniumサーバーを使用せずにブラウザードライバーに直接接続することです。分度器は、構成ファイルでdirectConnect:trueを設定することにより、Selenium Serverを使用せずに、ChromeおよびFirefoxに対して直接テストできます。

ブラウザの設定

ブラウザを設定および設定する前に、Protractorでサポートされているブラウザを確認する必要があります。以下は、分度器でサポートされているブラウザのリストです。

  • ChromeDriver
  • FirefoxDriver
  • SafariDriver
  • IEDriver
  • Appium-iOS/Safari
  • Appium-Android/Chrome
  • Selendroid
  • PhantomJS

ブラウザの設定は設定ファイルの機能オブジェクト内で行われるため、ブラウザの設定と設定は分度器の設定ファイルに移動する必要があります。

Chromeの設定

Chromeブラウザを設定するには、機能オブジェクトを次のように設定する必要があります

capabilities: {
   'browserName': 'chrome'
}

chromeOptionsにネストされているChrome固有のオプションを追加することもでき、その完全なリストは次のURLで確認できます。 https://sites.google.com/a/chromium.org/chromedriver/capabilities。

たとえば、右上にFPSカウンターを追加する場合は、構成ファイルで次のように実行できます。

capabilities: {
   'browserName': 'chrome',
   'chromeOptions': {
      'args': ['show-fps-counter=true']
   }
},

Firefoxのセットアップ

Firefoxブラウザを設定するには、機能オブジェクトを次のように設定する必要があります-

capabilities: {
   'browserName': 'firefox'
}

moz:firefoxOptionsオブジェクトにネストされているFirefox固有のオプションを追加することもでき、その完全なリストは次の場所で確認できます。 https://github.com/mozilla/geckodriver#firefox-capabilities。

たとえば、Firefoxでセーフモードでテストを実行する場合は、構成ファイルで次のように実行できます。

capabilities: {
   'browserName': 'firefox',
   'moz:firefoxOptions': {
     'args': ['—safe-mode']
   }
},

他のブラウザの設定

ChromeまたはFirefox以外のブラウザを設定するには、から別のバイナリをインストールする必要があります。 https://docs.seleniumhq.org/download/。

PhantonJSの設定

実際、PhantomJSはクラッシュの問題があるため、サポートされなくなりました。その代わりに、ヘッドレスChromeまたはヘッドレスFirefoxを使用することをお勧めします。これらは次のように設定できます-

ヘッドレスChromeを設定するには、次のように–headlessフラグを使用してChromeを起動する必要があります。

capabilities: {
   'browserName': 'chrome',
   'chromeOptions': {
      'args': [“--headless”, “--disable-gpu”, “--window-size=800,600”]
   }
},

ヘッドレスFirefoxをセットアップするには、Firefoxを次のコマンドで起動する必要があります。 –headless 次のようにフラグを立てます-

capabilities: {
   'browserName': 'firefox',
   'moz:firefoxOptions': {
      'args': [“--headless”]
   }
},

テスト用に複数のブラウザを設定する

複数のブラウザに対してテストすることもできます。このために、次のようにmultiCapabilities構成オプションを使用する必要があります-

multiCapabilities: [{
   'browserName': 'chrome'
},{
   'browserName': 'firefox'
}]

どのフレームワーク?

2つのBDD(ビヘイビア駆動開発)テストフレームワーク、JasmineとMochaがProtractorによってサポートされています。どちらのフレームワークもJavaScriptとNode.jsに基づいています。テストの作成と管理に必要な構文、レポート、およびスキャフォールディングは、これらのフレームワークによって提供されます。

次に、さまざまなフレームワークをインストールする方法を確認します-

ジャスミンフレームワーク

これは、分度器のデフォルトのテストフレームワークです。分度器をインストールすると、Jasmine2.xバージョンが付属します。個別にインストールする必要はありません。

モカフレームワーク

Mochaは、基本的にNode.jsで実行されるもう1つのJavaScriptテストフレームワークです。テストフレームワークとしてMochaを使用するには、BDD(ビヘイビア駆動開発)インターフェイスとChai AsPromisedでのChaiアサーションを使用する必要があります。インストールは、次のコマンドを使用して実行できます-

npm install -g mocha
npm install chai
npm install chai-as-promised

ご覧のとおり、mochaのインストール時に-gオプションが使用されます。これは、-gオプションを使用してProtractorをグローバルにインストールしたためです。インストール後、テストファイル内にChaiを要求して設定する必要があります。それは次のように行うことができます-

var chai = require('chai');
var chaiAsPromised = require('chai-as-promised');
chai.use(chaiAsPromised);
var expect = chai.expect;

この後、Chai AsPromisedをそのまま使用できます-

expect(myElement.getText()).to.eventually.equal('some text');

ここで、framework: 'mocha'を追加して、frameworkプロパティを構成ファイルのmochaに設定する必要があります。mochaの「reporter」や「slow」などのオプションは、次のように設定ファイルに追加できます-

mochaOpts: {
   reporter: "spec", slow: 3000
}

キュウリフレームワーク

Cucumberをテストフレームワークとして使用するには、フレームワークオプションを使用して分度器と統合する必要があります custom。インストールは、次のコマンドの助けを借りて行うことができます

npm install -g cucumber
npm install --save-dev protractor-cucumber-framework

ご覧のとおり、Cucumberのインストール中に-gオプションが使用されます。これは、Protractorをグローバルにインストールしたためです。つまり-gオプションを使用します。次に、フレームワークプロパティをに設定する必要がありますcustom フレームワーク: 'custom'およびframeworkPath: 'Protractor-cucumber-framework'をcucumberConf.jsという名前の構成ファイルに追加することによる構成ファイルの作成。

以下に示すサンプルコードは、Protractorでキュウリ機能ファイルを実行するために使用できる基本的なcucumberConf.jsファイルです。

exports.config = {
   seleniumAddress: 'http://localhost:4444/wd/hub',

   baseUrl: 'https://angularjs.org/',

   capabilities: {
      browserName:'Firefox'
   },

   framework: 'custom',

   frameworkPath: require.resolve('protractor-cucumber-framework'),

   specs: [
      './cucumber/*.feature'
   ],

   // cucumber command line options
   cucumberOpts: {
      require: ['./cucumber/*.js'],
      tags: [],
      strict: true,
      format: ["pretty"],
      'dry-run': false,
      compiler: []
   },
   onPrepare: function () {
      browser.manage().window().maximize();
   }
};