Developing complex web applications without systematic strategies for its quality assurance will lead to maintenance nightmares. End-to-end testing, from the moment the implementation is being planned up to the stage of deployment, requires careful planning and a suitable set of tools. In this talk, the use of various tools to assist such testing strategies will be uncovered. This involves the use of scriptable headless page automation (PhantomJS, Zombie.js, Selenium) for fast smoke testing as part of the precommit process and for more comprehensive preflight checks in the continuous integration system. In addition, a wide spectrum of testing possibilities will be achieved with extra tools such as static code analyzer, full-stack execution logger, profiler, and code coverage/instrumentation.
14. Error Tolerant
Mismatched quote var msg =
"Hello’;
Too many dots person..age = 18;
Incomplete, still typing if (person.
'use strict';
Strict mode violation with (person) {
}
15. Code Linting
var fs = require('fs'),
Not a strict equal esprima = require('./esprima'),
files = process.argv.splice(2);
files.forEach(function (filename) {
if (x == 9) { var content = fs.readFileSync(filename, 'utf-8'),
// do Something syntax = esprima.parse(content, { loc: true });
} JSON.stringify(syntax, function (key, value) {
if (key === 'test' && value.operator === '==')
console.log('Line', value.loc.start.line);
return value;
});
});
17. “Boolean Trap” Finder http://ariya.ofilabs.com/2011/08/hall-of-api-shame-boolean-trap.html
Obfuscated choice var volumeSlider = new Slider(false);
Double-negative component.setHidden(false);
filter.setCaseInsensitive(false);
Can you make up your mind? treeItem.setState(true, false);
The more the merrier event.initKeyEvent("keypress", true, true,
null, null, false, false, false, false, 9,
0);
18. Refactoring Helper
// Add two numbers // Add two numbers
function add(firt, two) { function add(first, two) {
return firt + two; return first + two;
} }
19. Syntax = Message
var Foo = (function () {
return { module Foo {
bar: function (x, y) { export function bar (x, y) {
// do Something // do something
} }
}; }
};
ES 5.1 Harmony
Today ES 6/7, Future
20. Transpilation
// Object literal property shorthand.
function Point(x, y) {
Harmony return { x, y };
}
// Object literal property shorthand.
ES 5.1 function Point(x, y) {
return { x: x, y: y };
}
26. Precommit Check
Typical Scenario
This is
awesome!
un
t to r
forge tests
the
Git: precommit hook
http://ariya.ofilabs.com/2012/03/git-pre-commit-hook-and-smoke-testing.html
27. Zombie.js
var Browser = require("zombie");
browser = new Browser();
browser.visit("http://mobileconference.nl", function () {
console.log(browser.text("title"));
});
38. Code Coverage https://github.com/itay/node-cover
https://github.com/coveraje/coveraje
https://github.com/pmlopes/coberturajs
x = 42;
if (false)
x = -1;
http://ariya.ofilabs.com/2012/03/javascript-code-coverage-and-esprima.html
39. Instrumentation for Code Coverage
{
var a = 5;
Statement __statement_ZyyqFc(1);
var a = 5;
}
{
__statement_ZyyqFc(2);
foo();
Expression __expression_kC$jur(3), foo();
}
function foo() {
function foo() { __block_n53cJc(1);
Block ... ...
}; }
http://itay.github.com/snug_codecoverage_slides/
40. Performance via Benchmarks.js
var suite = new Benchmark.Suite;
suite.add('String#indexOf', function() {
'Hello World!'.indexOf('o') > -1;
})
.on('complete', function() {
console.log('Fastest is ' +
this.filter('fastest').pluck('name'));
})
.run();
JSPerf.com