Productive JavaScript workflow Krzysztof Szafranek
Happy beginnings
Happy beginnings
11 years later...
2 years > 80 000 lines of JavaScript 4 major redesigns 15 front-end developers
Do you test every change in each browser? Before each commit? × ×
Are you sure you didn’t break any page in the application?
Do you know if you didn’t break somebody else’s code?
You don’t know
How to stay sane while working on a large JS project? Krzysztof Szafranek
Part I e basics
jslint will hurt your feelings Early
Unit testing
“But we don’t have time to write tests!” “My manager didn’t want unit tests”
How do you know your code works, when you don’t have a test for it?
How do you know your code still works aer each commit, when you don’t have a test for it?
You don’t know
Added bonus: Refactorings are a breeze
Refactoring without tests
Which framework? DOH Jasmine RhinoUnit JSUnit screw-unit JasUnit QUnit Test.Simple FireUnit Crosscheck Test.More Js-test-driver J3Unit TestCase Sinon.js JSNUnit TestIt SOAtest YUITest jsUnitTest Vows JSSpec JSTest Nodeunit UnitTesting JSTest.NET Tyrtle JSpec jsUnity
Doesn’t matter (As long as you use it) (And is easy to automate)
JS Test Driver
How about testing layouts?
Part II Putting it all together
Running tests in every browser takes time People make mistakes
Automation to the rescue!
Continuous Integration is a soware development practice where members of a team integrate their work frequently . . . leading to multiple integrations per day. Each integration is verified by an automated build (including test) to detect integration errors as quickly as possible. Martin Fowler
CI for front-end push jslint deploy tests
Early bug detection Early fixes No more FTP uploads Application is always shippable
Warning!
Part III Humans are useful, too
Pair programming
Best debugging tool ever
Code reviews
.. soware testing alone has limited effectiveness – the average defect detection rate is only 25 percent for unit testing, 35 percent for function testing, and 45 percent for integration testing. In contrast, the average effectiveness of design and code inspections are 55 and 60 percent. Steve McConnell Code Complete
A little help from the process Not Checked Code Design QA Started Out Review Review Review Are there unit tests?
Before we part 1. Use jslint and unit tests to get feedback early 2. Use CI to have shippable soware all the time 3. Don’t be afraid of your peers (and ducks)
Links http://www.jslint.com/ http://code.google.com/p/js-test-driver/ http://jenkins-ci.org/ http://sinonjs.org/
krzysztof@szafranek.net Photo credits: SpoiltCat, RemixDave, activeside, kate.gardiner, Jiheffe

Productive JavaScript Workflow