Embed Size (px)
DESCRIPTION
TDD with Google's JavaScript framework, AngularJS.
Citation preview
TDD WITH ANGULARJS
SIRAR SALIH
SOFTWARE ENGINEER
About me
HTML enhanced for web apps!
GET (once)
POST (later)
From wikipedia
• Directives– Powerful, Angular-only feature– Simplify DOM manipulation by reusable custom functionality
• Data binding– Models
• Controllers– Behavior– Avoid DOM manipulation
• Form validation– Easy client-side validation
• Localization– Filter directives
• Testability– Designed to be testable– Easy dependency injection
• +++
• Module– Sub-modules
• Controller
• Directive
• Service– Data
• Service– Data
«With great power, comes great responsibility.» – Uncle Ben
Test Driving AngularJS
«With great power, comes great responsibility.» – Uncle Ben
«With great power, comes great responsibility.» – Uncle Ben
• Jasmine
«With great power, comes great responsibility.» – Uncle Ben
• Jasmine
«With great power, comes great responsibility.» – Uncle Ben
• Jasmine
«With great power, comes great responsibility.» – Uncle Ben
• Karma test runner
«With great power, comes great responsibility.» – Uncle Ben
• Karma test runner
«With great power, comes great responsibility.» – Uncle Ben
• Karma coverage (Istanbul plugin)
«With great power, comes great responsibility.» – Uncle Ben
• Karma coverage (Istanbul plugin)
Demo time!
Test Automation
«With great power, comes great responsibility.» – Uncle Ben
«With great power, comes great responsibility.» – Uncle Ben
• Grunt
«With great power, comes great responsibility.» – Uncle Ben
• Karma TeamCity (TeamCity plugin)
«With great power, comes great responsibility.» – Uncle Ben
• Karma TeamCity (TeamCity plugin)
«With great power, comes great responsibility.» – Uncle Ben
• Karma TeamCity (TeamCity plugin)
«With great power, comes great responsibility.» – Uncle Ben
• Karma coverage (Istanbul plugin)
Best Practices
Naming Conventions
• File naming– mainCtrl.js– mainSvc.js– mainDirective.js
• JavaScript – mainController– mainService– mainDirective
• HTML– <main-directive></main-directive>
Design Patterns
• Feature Pattern– Break into feature folders
Design Patterns
• Enterprise Pattern– Break into component folders
Design Patterns
• App Pattern– Break into module folders
Thank you / Questions?
Blog: http://sirars.com/ • [email protected] / [email protected]• @SirarSalih
![Data-Driven and Keyword-Driven Test[1]](https://img.pdfslide.us/doc/110x75/577ce76d1a28abf103951d8d/data-driven-and-keyword-driven-test1.jpg)
