Testing AngularJS app
Maximizing confidence through a minimalistic approach
David Boureau
@davidb583
AngularJS Paris, 26th March 2014
Part I
What is this talk about ?
Who do NOT have any test ?
Reset
What kind of test
Functional testing (businessman) - launched sometimes
Integration testing
Unit testing (developer) - launched continuously
TDD !
source : agileinflash.blogspot.com
Which means...
source : simple-talk.com
Testing strategies : isolated islands
Part II
Preparing Demo
The application
What we're trying to reach
App overview
Focus
How do we test : black box testing
Black box testing
Conclusion of part II
-> We saw the final app
-> We chose the black box testing
Part III
Demo !!
-> app : AngularJS 1.2.10
BlackboxJS 0.0.1 (fork of ngScenarios)
stubbed server : node + express
IDE : ST2
Part IV
Lessons from this demo
What we saw
- e2e is enough : func + tech coverage
- TDD is applied, first loop only
- keep it minimalistic
- Confidence comes first from manual, visual checking
- Watch for antipatterns !
- Check not only the visible part, but also the invisible
- DELETE or MOVE tests : only the happy path in the main test suite
Unit test
-- brittle
- duplication of mocks
--- politics
- hard to write
-- hard to maintain
--- MVC, V is forgotten
-- MVC, M&C already tested if unit+e2e
- don't resist technical refactoring
++ fast
+ help to design
++ extremely high coverage
++ better when starting a project
Why such a method
+ very few politics
++ easy to write
+++ covers M, V and C only once
++ resist technical refactoring
++ need only few test for high code coverage
+- quite easy to maintain
+- quite fast
-- can't help for design (but design can be good anyway)
Lesson of tech code coverage
- Doesn't need to be 100%
- Excellent measure of long term effort
- Deletion of dead code
Tools
- ngScenario
- Protractor
- CasperJS
- SlimerJS
- TrifleJS
-WebDriverJS
Conclusion
- An easy way to start
- May not apply everywhere
- interesting websites
Testing AngularJS app
By david borow
Testing AngularJS app
A way to test a single page application written in AngularJS : a full e2e approach
