Web Driver IO Tutorial
JavaScript HTML Other
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
HTML Added link and javascript to open another window Feb 27, 2017
common Removed callbacks from reusable commands Sep 9, 2015
json-server Added restore data information Aug 23, 2015
pageobjects Initial page object example check in Feb 20, 2017
.gitignore Added screenshots Sep 18, 2015
.travis.yml testing Feb 28, 2017
CHANGELOG.md Version 1.5.1 Feb 28, 2017
Gruntfile-dataLoopExample2.js Updated to use wdio Sep 7, 2015
Gruntfile-gruntSaucelabs.js Updated to use wdio Sep 7, 2015
Gruntfile.js Updated comment Nov 17, 2015
LICENSE Added license information Aug 24, 2015
README.md Added multi windows examples Feb 27, 2017
autoComplete1.js Updated to support >v4 webdriverio Feb 18, 2017
callbackPromise.js Updated to support >v4 webdriverio Feb 18, 2017
carouselExample1.js Updated to support >v4 webdriverio Feb 18, 2017
copyright1-wdio.js New WDIO example Feb 18, 2017
copyright1.js Updated to support >v4 webdriverio Feb 18, 2017
cssValidation1.js Updated to support >v4 webdriverio Feb 18, 2017
dataLoopExample1.js Updated to support >v4 webdriverio Feb 18, 2017
dataLoopExample2-wdio.js Updated for wide Feb 22, 2017
dataLoopExample2.js Updated to support >v4 webdriverio Feb 18, 2017
dbDataLoopExample.js Updated comments Sep 2, 2015
debugExample1.js Updated to support >v4 webdriverio Feb 18, 2017
dropDownMenu1.js Updated to support >v4 webdriverio Feb 18, 2017
dynamicBrowser.js Updated to support >v4 webdriverio Feb 18, 2017
excelDataLoopExample.js Update excel data source example using package excel to node-xlsx Nov 28, 2015
formFieldValidation.js Updated to support >v4 webdriverio Feb 18, 2017
formFillSubmit1.js Updated to support >v4 webdriverio Feb 18, 2017
gruntSaucelabs.js Added run instructions Aug 12, 2015
iframe1.js Updated to support >v4 webdriverio Feb 18, 2017
linkTextURL1.js Updated to support >v4 webdriverio Feb 18, 2017
linkTextURL2.js Updated to support >v4 webdriverio Feb 18, 2017
modal1.js Updated to support >v4 webdriverio Feb 18, 2017
multiWindows1-wdio.js Changed files name to be consistent Feb 27, 2017
multiWindows1.js simplified Feb 27, 2017
package.json Updated services Feb 28, 2017
pageObjectExample1.js Updated comments Feb 27, 2017
restAPIExample1.js Updated to support >v4 webdriverio Feb 18, 2017
saucelabs-sauceconnect.js Updated the comments for clarity Aug 13, 2015
saucelabs.js Updated timeout Feb 22, 2017
screenShot1.js Updated to support >v4 webdriverio Feb 18, 2017
selectbox1.js Updated to support >v4 webdriverio Feb 18, 2017
showHideVerify1.js Added Grunt-Webdriver detection Aug 6, 2015
testData1.xlsx Initial commit Nov 24, 2015
tutorial1-wdio.js New WDIO example Feb 18, 2017
tutorial1.js Updated to support >v4 webdriverio Feb 18, 2017
wdio.conf-copyright1.js New WDIO example Feb 18, 2017
wdio.conf-gruntSaucelabs.js Updated to use wdio Sep 7, 2015
wdio.conf-gruntfile.js Updated comment Nov 17, 2015
wdio.conf-local-dataLoopExample2.js Changed name Feb 22, 2017
wdio.conf-multiWindows1.js Changed files name to be consistent Feb 27, 2017
wdio.conf-pObjEx1.js Initial page object example check in Feb 20, 2017
wdio.conf-saucelabs-dataLoopExample2.js Updated for wdio Feb 22, 2017
wdio.conf-saucelabs-tutorial1.js testing Feb 28, 2017
wdio.conf-tutorial1.js minor change Feb 20, 2017
wdio.conf-web-driver-io-tutorial.js testing Feb 28, 2017

README.md

Web Driver IO Tutorial

Build Status

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

Filename Description
tutorial1.js Title Test - Open page and verify title
tutorial1-wdio.js Title Test - Open page and verify title using WDIO
linkTextURL1.js Link Text/URL Test - Verify Link Text and URL
copyright1.js Copyright Test - Verify Copyright Text
copyright1-wdio.js Copyright Test - Verify Copyright Text using WDIO
formFillSubmit1.js Populate Form Fields and Submit
showHideVerify1.js Click Show/Hide Button and Verify Text
dynamicBrowser.js Dynamically Invoke Different Browsers
callbackPromise.js Compares callbacks VS promises
debugExample1.js Example Shows Several Methods on How to Debug
formFieldValidation.js Example of Validating Form Field Errors With Both Local Commands and Reusable Commands (commonLib.js)
common/commonLib.js Example of Reusable Functions (library)
dataLoopExample1.js Looping Static Data to Validate URL Link/Text
dataLoopExample2.js Looping Static Data to Populate Form Fields
pageObjectExample1.js Example how to use page objects
pageobjects/web-page.js Example of page objects
linkTextURL2.js Link Text/URL Test By Looping Through Elements
cssValidation1.js Example how to validate several CSS properties
dropDownMenu1.js Example how to validate dropdown menu selections
carouselExample1.js Example how to validate image carousels
screenShot1.js Example how to take screenshots at different browser widths
autoComplete1.js Example how to select and validate autocomplete input field
iframe1.js Example how to select / interact multiple iframes on a page
modal1.js Example how to interact with a modal window (bootstrap)
selectBox1.js Exmample how to interact with selectbox
saucelabs.js Example how to use cloud based test site (saucelabs)
gruntSauceLabs.js Example how to use grunt + grunt-webdriver + saucelabs
restAPIExample1.js Example how to use supertest to test REST APIs
dbDataLoopExample.js Example how to use database (mongoDB) driven testing
excelDataLoopExample.js Example how to use excel as a data source for test data
multiWindows1.js Example how to work with multiple windows
multiWindows1-wdio.js Example how to work with multiple windows using WDIO

Configuration Files

Filename Description
wdio.conf-tutorial1.js WDIO config for tutorial1-wdio.js using Firefox
wdio.conf-copyright1.js WDIO config for copyright1-wdio.js using Firefox
wdio.conf-pObjEx1.js WDIO config for pageObjectExample1.js using Firefox
wdio.conf-gruntfile.js WDIO config with 3 browser/OS configs against saucelabs
wdio.conf-saucelabs-dataLoopExample2.js WDIO config file for dataLoopExample2.js on two different OS/browsers (saucelabs)
wdio.conf-local-dataLoopExample2.js WDIO config file for dataLoopExample2.js on two different browsers (locally)
wdio.conf-multiWindows1.js WDIO config for multiWindows1-wdio.js using Firefox
Gruntfile.js Example Gruntfile with grunt-webdriver and 3 browser/OS configs
Gruntfile-dataLoopExample2.js Gruntfile for dataLoopExample2.js to run against saucelabs
Gruntfile-gruntSaucelabs.js Gruntfile for gruntSaucelabs.js to run against saucelabs

Data Files

Filename Description
testData1.xlsx excel spreadsheet with test data

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

OR

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

  • show more should assertion lib examples
    • show examples deepEqual()
  • show example using control characters
  • show example using custom reporter
  • show example using page object - DONE
  • 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

License

MIT © 2015-2017 Tony Keith tony.keith@yahoo.com WEBSITE