1. @kylehodgson
www.kylehodgson.com

3. +

4. Testable Angular
Writing testable code

5. Toy App: ToDontList
Story Epic
As a busy executive with too much to do,
I would like to see a list of things that are not
worth my time,
So that I can avoid doing them.

9. How do you get at this code?
Testability

10. Namespace = {};
Testability

13. Unit tests should
test your code
Testability

14. .
├── app
│ ├── app.js
│ ├── controllers
│ │ └── list-controller.js
│ └── services
│ └── list-items-service.js
├── index.html
└── items.json
Testability

15. app/services/list-items-service.js
app/services/list-items-service.js

16. app/app.js
app/app.js

17. specs/services/list-items_test.js

18. Testing Dependencies
Mocking

20. Open Source Libraries
• RequireJS
• Sinon: mocking
• Karma: test runner
• Jasmine: unit test framework
o Jasmine as promised
• Chai: assertions
o Chai as promised
• Duck Angular: interaction testing

21. Duck Angular
Angular Integration Testing

22. Duck Angular
Run it in Karma
Get it with Bower
bower install duck-angular

23. Duck Angular & Karma

24. Duck Angular: Bindings

25. Duck Angular: Interactions

28. Anatomy of a Duck Angular spec
Duck Angular

30. • Keep DOM manipulation in specific pieces;
for instance, Directives, or in a service
where required
DOM Manipulation

31. End to End
AngularJS

32. E2E
http://docs.angularjs.org/guide/e2e-testing
sic: depricated is mis-spelled on angular’s site

33. Selenium
• Mature
• Well understood
• “Enterprise strength”
• Terrible “SPA” support

34. Protractor
Functional Testing for AngularJS
https://github.com/angular/protractor

35. Protractor
Not good (with) Karma.

36. searches for elements by matching
binding names, either from ng-bind
or {{}} notation in the template
by.binding

37. by.model
by.model searches for elements by
input ng-model

39. by.repeater
by.repeater searches for ng-repeat
elements.

42. Web server
Selenium
Java
Protractor pre-reqs

43. Kyle Hodgson
www.kylehodgson.com @kylehodgson
Avishek “Mojo” Sen Gupta
www.avishek.net
@avisheksengupta
Questions?
www.angularjs.org
www.yearofmoo.com
www.egghead.io
www.pluralsight.com
github.com/asengupta/duck-angular
github.com/kylehodgson/angular-toy