Selenium WebDriverを使用して、Yandex.Mail Webインターフェイスを自動的にテストする

品質テストなしでは、大規模なWebサービスを開発および保守することは不可能です。 開発の初期段階では、特定のテスト計画に従って手動テストを実行することはしばしば可能ですが、新機能の登場とテストケース数の増加により、それに満足することはますます難しくなっています。 この記事では、Selenium WebDriverとNode.jsを使用してYandex.Mail Webインターフェイスの機能テストを自動化する方法について説明します。



Selenium WebDriverに加えて、 Watir 、 Zombie.js 、 PhantomJSなど、Webインターフェースの自動テスト用のソリューションがいくつかあります。 しかし、実際に標準となったのは彼でした。 まず、優れた機能を備えています。 次に、モバイルブラウザーを含むすべての一般的なブラウザーと、ヘッドレスツール（Zombie.js、PhantomJS）とは言えないプラットフォーム用のドライバーがあります。

なぜNode.jsなのか？ フロントエンドのYandex.Mail開発者はすべてJavaScriptを知っているため、つまり、インターフェースを開発し、リリースごとにどこで何が変更されるかを理解しています。

インストールとセットアップ

Selenium WebDriverをローカルマシンにインストールして構成するには、次のものが必要です。

1. Java（ http://www.java.com/en/download ）。
2. Seleniumサーバー（スタンドアロンバージョンはhttps://code.google.com/p/selenium/downloads/lisからダウンロードできます ）。
3. Node.js + npm（ http://nodejs.org/download ）。
4. ChromeDriver（Google Chromeでのテスト用）。 ここから揺れます： code.google.com/p/chromedriver/downloads/list

必要な依存関係をすべてインストールした後、次を実行します。

1. Node.js用のselenium-webdriverをインストールします。

   npm install selenium-webdriver -g 

   
   
2. Seleniumサーバーを起動します。

    java -jar selenium-server-standalone-{VERSION}.jar 

   
   

最初のテスト

例として、簡単なテスト（test.js）を作成します。

 var wd = require('selenium-webdriver'); var assert = require('assert'); var SELENIUM_HOST = 'http://localhost:4444/wd/hub'; var URL = 'http://www.yandex.ru'; var client = new wd.Builder() .usingServer(SELENIUM_HOST) .withCapabilities({ browserName: 'firefox' }) .build(); client.get(URL).then(function() { client.findElement({ name: 'text' }).sendKeys('test'); client.findElement({ css: '.b-form-button__input' }).click(); client.getTitle().then(function(title) { assert.ok(title.indexOf('test — : ') > -1, '   :('); }); client.quit(); }); 

コードは非常に簡単です：

1. Selenium-webdriverを接続します。
2. 目的のブラウザーでクライアントを初期化し、セレンサーバーがあるホストを転送します。
3. www.yandex.ruを開きます。
4. ロード後、検索行（ ) “test” ( CSS- '.b-form-button__input');を入力) “test” ( CSS- '.b-form-button__input');
   検索結果ページのタイトルを取得し、その中にサブストリング「test-Yandex：found」を探します。
   
   docs.seleniumhq.org -Seleniumのドキュメント。
   code.google.com/p/selenium/wiki/WebDriverJs-WebDriver.jsのドキュメント。
   dvcs.w3.org/hg/webdriver/raw-file/default/webdriver-spec.htmlは、WebDriver API仕様のドラフトです。