1. jQuery Plugins
& Jasmine
A lightning quick example
@mparramon

2. What?
With
· some useful js code
Create
· a full-fledged jQuery
plugin
· with unit testing

3. File inputs in some browsers:
The problem

4. let's fix it!
· add styling
· custom button
· initial value
Based on quirksmode.org/dom/inputfile.html

5. jQuery plugin
http://docs.jquery.com/Plugins/Authoring

6. Basic Framework

7. Defaults and options

8. Mantaining chainability

9. Unit testing with Jasmine
http://pivotal.github.com/jasmine/

10. Initial setup
Modify SpecRunner.html:

11. DSL

12. jasmine-jquery
2 extensions for Jasmine:
· an HTML fixtures API
· a set of jQuery custom matchers
https://github.com/velesin/jasmine-jquery

13. Fixtures

14. Expectations

15. Our final code
jquery-enhancedfileinput
↳ lib
↳ jasmine-1.3.0
spec
↳ jquery-enhancedfileinput_spec.js
↳ jasmine-jquery-1.3.1.js
src
↳ jquery-enhancedfileinput.js
↳ demo.html
↳ README.md
↳ SpecRunner.html

16. No time!
@mparramon
github.com/mparramont
Questions?