Using Selenium WebDriver to automatically test the Yandex.Mail web interface

Without quality testing it is impossible to develop and maintain a large web service. At the early stages of its development, it is often possible to manage only with manual testing for a given test plan, but with the advent of new features and an increase in the number of test cases, it becomes more and more difficult for them to be content with them. In this article, we will discuss how to automate the functional testing of the Yandex.Mail web interface using Selenium WebDriver and Node.js.



In addition to Selenium WebDriver, there are several solutions for automatic testing of web interfaces, including Watir , Zombie.js , PhantomJS . But it was he who became practically the standard. First, it has good functionality. And secondly, there are drivers for it under all common browsers - including mobile - and platforms, which can't be said about headless tools (Zombie.js, PhantomJS).

And why Node.js? Because all the frontend developers of Yandex. Mails know JavaScript, and it is they who develop the interface and understand where and what changes in it from release to release.
')

Installation and Setup

To install and configure Selenium WebDriver on a local machine, you will need:

1. Java ( http://www.java.com/en/download ).
2. Selenium server (you can download the standalone version here - https://code.google.com/p/selenium/downloads/lis ).
3. Node.js + npm ( http://nodejs.org/download ).
4. ChromeDriver (for testing in Google Chrome). Swings from here: code.google.com/p/chromedriver/downloads/list .

After installing all dependencies you need:

1. Install selenium-webdriver for Node.js:

   npm install selenium-webdriver -g 

   
   
2. Start the selenium server:

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

   
   

First test

For example, let's write a simple test (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(); }); 

By code, it's pretty simple:

1. We connect selenium-webdriver;
2. We initialize the client with the indication of the necessary browser and the transfer of the host on which we have the selenium-server;
3. Open www.yandex.ru;
4. After loading, enter ) “test” ( CSS- '.b-form-button__input'); in the search line ( ) “test” ( CSS- '.b-form-button__input');
   We get the title of the search results page and look for the substring 'test - Yandex: found' in it.
   
   docs.seleniumhq.org - documentation for Selenium.
   code.google.com/p/selenium/wiki/WebDriverJs - WebDriver.js documentation.
   dvcs.w3.org/hg/webdriver/raw-file/default/webdriver-spec.html is a draft of the WebDriver API specification.