web-driver-io-tutorial

v1.5.0

Published

2 years ago

WebDriverIO Tutorial with working web site and examples

Downloads

Web Driver IO Tutorial

This is the README for the Web Driver IO Tutorial.

Please see my blog for a complete description of the files and much more information located at:

My Blog

The live working test site for the tutorial is located at:

Working Test Site

This project was updated to support version 4 of webdriverio

Background

I recently had an interesting challenge presented to me. I needed to introduce automated testing to a Q/A department with very little technical experience and no programming experience.

This was really two (2) separate challenges. The first was to find the technologies to use to do the automated testing. The second was actually training the Q/A department.

The project will only address the technologies used and what I learned in the process.

The technologies worked well but I really had to search for information and spent many hours figuring out issues. There doesn't seem to be much on the Internet about this. I wanted to share this information, so I wrote this project along with a web site page to test all the scripts against.

I hope you find this project useful. If you do, please let me know.

Objectives

Use Technologies That:

Can test web site functionality
Can test JavaScript functionality
Can be run manually from command line
Can be run automatically with a CI
Have an easy to learn language for non programmers
- Q/A personnel with basic knowledge of HTML and JavaScript
Use open source software (except cloud based testing platforms)

Technologies

List of technologies I choose:

mocha – test framework and executes the test scripts (test runner)
shouldjs – expressive, readable, assertion library (test if something is true)
webdriverio – browser control bindings (JS language bindings to communicate with Selenium)
selenium – browser abstraction and running factory
grunt - javascript task runner (used as test runner for cloud based testing platform)
grunt-webdriver - grunt plugin for webdriver (uses wdio as test runner)
wdio - test runner
Browser/Mobile drivers + browsers
- Firefox (Browser and driver)
- Chrome (Browser and driver)
- IE (Browser and driver)
- Safari (Browser and driver plug-in)
- Opera (Browser)

(Not really webdriverio related but very good information)

supertest - test REST APIs
json-server - mock REST API server
mongodb + promise-mongo - test database driven testing
node-xlsx - Excel parser & builder

Tutorial Files

Configuration Files

Data Files

TEST

Create selenium directory:

$ mkdir selenium

Install Selenium Stand Alone Server: Go to http://www.seleniumhq.org/download/ Download jar file (3.0.1 latest at this time) Save/move into the “selenium” directory Add "selenium" directory to PATH

Start the Selenium Stand Alone Server (terminal):

 $ java -jar selenium-server-standalone-3.0.1.jar

Firefox: Install firefox browser, if not already installed.

Firefox driver (GeckoDriver): Go to https://github.com/mozilla/geckodriver/releases Download latest driver untar

$ tar -xvf <drivername>

Save/move to "selenium" directory

$ git clone https://github.com/onewithhammer/WebDriverIOTutorial.git
$ cd WebDriverIOTutorial
$ npm install
OR 
$ sudo npm install

RUN TESTS

Run locally single test using mocha as framework and runner:

$ mocha [test-script-filename]

$ mocha tutorial1.js

Note: saucelabs.js & gruntSauceLabs.js - You will need a saucelabs account in order to set the environment variables for SAUCE_USERNAME & SAUCE_ACCESS_KEY

$ export SAUCE_USERNAME=[your saucelabs username]
$ export SAUCE_ACCESS_KEY=[your saucelabs access key]

Run grunt with default config file - Gruntfile.js using mocha as framework & wdio as runner. The config file will run a few test files against saucelabs with different OS/browser combinations.

$ grunt [task-name]

$ grunt webdriver

Run grunt specifying a config file:

$ grunt --gruntfile <config-filename> [task name]

Run locally a single test using mocha as framework and wdio as the runner on 2 OS/browsers:

$ grunt --gruntfile Gruntfile-dataLoopExample2.js webdriver

Run locally single test using mocha as framework and wdio as the runner:

$ wdio [config-filename]

$ wdio wdio.conf-dataLoopExample2.js

Run on saucelabs a single test using mocha as framework and wdio as the runner on 2 OS/browsers:

$ wdio [config-filename]

$ wdio wdio.conf-saucelabs-dataLoopExample2.js

TEST REST APIs

Install json-server

$ npm install -g json-server

Start json-server first with json database file (db.json)

$ cd json-server
$ json-server db.json

see https://github.com/typicode/json-server for github project. see http://jsonplaceholder.typicode.com/ for working demo online of json-server.

then run script

$ mocha restAPIExample1.js

Use a tool like postman to view the data before and after the script is ran.

Use it.skip() to skip specs.

Note: json-server will update the db.json file.

To restore the original file (stop server first):

cp db-bak.json db.json

USE DB TEST DATA

Install and make sure mongoDB is running locally then run script

$ mocha dbDataLoopExample.js

TO DO

use WDIO as the test runner - DONE
- see wdio config files
show example of CI (Travis) - DONE
- see .travis.yml file for more details
show more should assertion lib examples
- show examples deepEqual()
- show examples of property() - DONE
- show examples of instanceOf() - DONE
show chai assertion lib examples
show examples of testing REST API - DONE
- use custom assertions - DONE
show examples of screenshots - DONE
show example of autocomplete field - DONE
show example using ES6 generator - DONE
show example using iframe - DONE
show example using control characters
show example using modal - DONE
show example of selectbox - DONE
show example using excel as a data source - DONE
show example using custom reporter
show example using page object
Update examples to use old async method and V4 - NA
Write examples of all using sync method and V4 - IN PROGRESS

Change Log

see the CHANGELOG