Download - Testing your Single Page Application
tweet #tarabica14
tweet #tarabica14
tweet #tarabica14
>whoami• Senior Developer in Seavus• Coding professionally since last century• Rabid about code qualty• Cofounder of Macedonian .net community• I love C#• I hate JavaScript, but I love web development
tweet #tarabica14
What will this talk be about• A little bit of history • A little bit of present• What is and what isn’t an SPA?• Why test software?• Design for quality• How can I test Single Page Applications?• Demo
tweet #tarabica14
A little bit of history• What’s the deal with this web thing?
• What is this thing called Javascript???
• Build in Netscape in 1995, focused on non-
professional developers.
• Standardized as ECMAScript (in 1999) – a.k.a.
Internet Prehistory
• What is this thing called DOM???
tweet #tarabica14
A little bit of present
• The rise of the Single-Page Application
• Heavy client logic, getting heavier
• Stateless web is dead and more alive than ever
• The attack of the APIs and services
• Ongoing M/V separation
tweet #tarabica14
So what is an SPA• Desktop-like user experience• Starts, and stays on a single page load• Client-side development• The server should be as thin and as stateless as
possible
tweet #tarabica14
Dataset
SQL
Database Server Desktop Client
Classic Client-Server (VB6)
tweet #tarabica14
Dataset
SQL
Database Server Desktop Client
Web ServerWeb Client
Modern Client-Server (SPA)
HTTP API Request
JSON Data
tweet #tarabica14
Why is testing needed• Software has bugs• Users and clients have bugs too• The problem space is extremely complex – almost-
exponential complexity• Software is never done done.• Some aspects are prone to automation• Unit tests• Functional tests• Integration tests• Regression tests
tweet #tarabica14
Quality by design – Pit of Success• KISS / DRY / YAGNI / SOLID
• Refactoring
• Separate responsibilities
• Avoid mixing of different levels of abstraction
• Manage dependencies
• Write testable code
• Code that does not exist, cannot have bugs
tweet #tarabica14
Testing libraries• QUnit• Jasmine• Mocha• Chai• Selenium• Phantom.js• Buster.js• Blanket.js• Casper.js• Chutzpah
• Sinon.js• JsMockito• jqMock• mockjax• Watir / WatiN• Sahi• expect.js• YUI Test• JSTestDriver• ….
tweet #tarabica14
How should I test JavaScript• Javascript code is just code!• Dynamic structure actually helps• Unit test frameworks• Headless browsers• Regular browsers• Integration with CI tools
tweet #tarabica14
How should I test everything else?• The old, tried way – Eyeballs on the job• Browser automation• Taking and comparing screenshots• Selenium WebDriver
tweet #tarabica14
DEMOA very simple knockout.js based SPA tested with QUnit, Chutzpah and PhantomJS
tweet #tarabica14
