How to set up a simple autotest system without Java and Selenium

Imagine: you are an employee of a startup, you have quickly built up a prototype and gradually begin to develop it. And now you already want to, during the next urgent release, you do not have to recheck all sections of the site manually (by the hands of the product director). Of course, you can hire a separate tester, but they don’t give you a budget for your LEAN-startup - “let's better buy a coffee machine at last”. Familiar?

And then someone says the word "autotest".

And it immediately begins: this is a whole story, it is very difficult, it is very expensive, there will be more harm from this than good, and in general it is a bloody Enterprise and SELENIUM.
')

And all you need is for a program to open a browser and poke links there, type in texts and watch what happens. Is it really that hard and expensive?

Now it is safe to say no.

Everything has changed recently - with the advent of Headless Chrome: in the next version of Chrome, he just learned how to run in “headless” mode (that is, without an interface).

And even the main developer of PhantomJS'a wrote in connection with this:

This is the end - https://t.co/GVmimAyRB5 #phantomjs 2.5 will not be released. Sorry, guys!

- Vitaly Slobodin (@Vitalliumm) April 13, 2017

Getting down to business

So, all you need to run autotests in the modern world is:

1) Chrome version 59 (currently beta ) or Chromium Browser
2) nodejs + npm

Everything!

(Of course, if you do something specific that needs to be checked in different browsers, then alas. You can no longer read.)

Chrome in this bundle acts, obviously, as a headless browser, opening links and rendering pages. (What could be better in the role of a headless browser than the browser itself ?!) Here's how easy it is to install the same Chromium Browser in Ubuntu:

sudo apt-get install chromium-browser 

As a so-called WebDriver, providing an API to "poke links and drive texts," we will use the Chromedriver. Install via npm:

 npm install chromedriver 

We ourselves, of course, want to write the tests in pure JavaScript (2–17 year in the yard). To do this, take Nightwatch.js - this is a very well-known library for writing and running autotests (from LinkedIn developers). Originally Nightwatch.js is sharpened to work with the very Selenium. But not everyone knows that it also knows how to work directly with the Chromedriver. Install:

 npm install nightwatch 

In brief, the whole scheme looks like this (test for Nightwatch.js → a series of requests to Chromedriver → poking links in Headless Chrome):

→ Chromedriver →

And how to set up something?

By default, the configuration for Nightwatch is taken from the nightwatch.json file from the node_modules / nightwatch / bin folder .

We need our own configuration. To do this, create the nightwatch.json file at the root of the project and register everything necessary there so that the Chromedriver is used directly (without Selenium) and Chromium is launched in “headless” mode:

nightwatch.json

 { "src_folders": ["tests"], //      "output_folder": "reports", "custom_commands_path": "", "custom_assertions_path": "", "page_objects_path": "", "globals_path": "globals.js", //   ,         "selenium": { "start_process": false //   , ..    Chromedriver  }, "test_settings": { "default": { "selenium_port": 9515, //   Chromedriver   ("selenium_"    —   ) "selenium_host": "localhost", "default_path_prefix" : "", "desiredCapabilities": { "browserName": "chrome", "chromeOptions" : { "args" : ["--no-sandbox", "--headless", "--disable-gpu"], //       headless- "binary" : "/usr/bin/chromium-browser" //      }, "acceptSslCerts": true } } } } 

Notice the line with globals.js . Inside this file, you can set a global context for all tests. Let's prescribe there so that the Chromedriver starts before all the tests are started and is nailed at the end:

globals.js

 const chromedriver = require('chromedriver'); module.exports = { before: function(done) { chromedriver.start(); done(); }, after: function(done) { chromedriver.stop(); done(); } }; 

It remains to write some test for verification. For example: open ya.ru, search for something and check the search results. Of course, the Nightwatch.js API provides a whole bunch of all sorts of methods for all sorts of checks, but first we have enough:

tests / ya.js

 module.exports = { 'Test ya.ru': function(browser) { const firstResultSelector = '.serp-list .organic__subtitle b'; browser .url('http://ya.ru', () => { console.log('Loading ya.ru...'); }) .waitForElementVisible('#text', 5000) .execute(function() { document.getElementById('text').value = ', !'; }) .submitForm('form') .waitForElementVisible(firstResultSelector, 5000) .getText(firstResultSelector, result => { browser.assert.equal(result.value, 'm.habrahabr.ru'); }) .end(); } }; 

Check!

 $ nightwatch --test tests/ya.js [Ya] Test Suite =================== Running: Test ya.ru Loading ya.ru... Element <#text> was visible after 70 milliseconds. Warn: WaitForElement found 10 elements for selector ".serp-list .organic__subtitle b". Only the first one will be checked. Element <.serp-list .organic__subtitle b> was visible after 1706 milliseconds. Passed [equal]: m.habrahabr.ru == m.habrahabr.ru OK. 3 assertions passed. (4.992s) 

Total

Total the whole process of setting up the AutoTest system took less than half an hour. And, most importantly, the same system can be quickly deployed on virtually any server, which gives excellent scalability.

So goodbye Java, goodbye tests on Python, goodbye Selenium.

But the coffee machine is really needed.

Useful links:

1) “Getting Started with Headless Chrome”
2) "Nightwatch.js API reference"
3) A good presentation on the topic of Nightwatch.js