Session from GIDS 2014, showing how to do automated Web testing using a variety of JavaScript frameworks, including QUnit, Jasmine, Protractor, Selenium, and PhantomJS
12. Simple function to add two numbers
var add = function(x, y){
var result = x + y;
return result;
};
13. Let's write a test!
var add = function(x, y){
var result = x + y;
return result;
};
test("test that add function doesn't return null", function() {
var result = add(2, 3);
notEqual(result, null, "We expect the value to be non null");
});
14. Test that is performing an assertion
4 Lot's of code just to test a single value
4 Test will rarely, if ever, fail
4 Quality vs. quantity of tests
15. Simple function to add two numbers
var add = function(x, y){
var result = x + y;
return result;
};
16. Simple function to add two numbers
var add = function(x, y){
var result = x + y;
console.assert(result, "X should not be null!");
return result;
};
18. Simple function to add two numbers
var add = function(x, y){
var result = x + y;
assert(result, "An error has occured with this page. Please refresh.");
return result;
};
26. Selenium
4 Selenium IDE - Basic test
recorder, implemented as a
Firefox extension
4 Selenium WebDriver -
Formerly Selenium RC, remote
control for browser
4 Selenium Grid - Instantiate
browsers on remote machines
29. Selenium IDE/Builder
4 Quick/easy to create tests
4 However, no test inheritence
4 Output is HTML or JSON, not script
4 Difficult to inject any complex logic
4 Has to be manually run through Firefox
31. WebDriver Specification
4 W3C Working Draft
4 Platform and language neutral interface to allow
control of a Web browser
4 Wire level protocol using HTTP and JSON
4 https://dvcs.w3.org/hg/webdriver/raw-file/default/
webdriver-spec.html
32. Selenium WebDriver
4 Implementation of WebDriver
protocol
4 Runs on host, listens on ports
4 Invokes browser (as
configured)
4 Drives browser to test
application
39. What did we see?
4 Tests written using Jasmine
4 Being invoked using
Protractor
4 Sent to Selenium server using
WebDriver protocol
4 Selenium invoking Chrome to
run tests
40. Demo - Using WebBuilder
to create Protractor tests
41. Demo - Can I do unit
testing with WebDriver
also?
43. PhantomJS
4 http://phantomjs.org
4 Headless (Qt-based) WebKit
with JavaScript API
4 Ability to act as a browser
without actually having a GUI
4 Ideal for running in hosted
instances (e.g. docker)
47. Nice - but yet
another framework?
4 PhantomJS can be invoked by
Selenium as a virtual browser
4 (Configure Selenium to invoke
PhantomJS CLI instead of
Chrome executable)
53. Wrapping Up
4 Many options for creating powerful Web tests using
JavaScript
4 Abundance of frameworks, many of which are
modular
4 Unit and end-to-end tests in both browser-based
and headless mode