$30 off During Our Annual Pro Sale. View Details »

BASTA 2013: JavaScript Unit Testing

BASTA 2013: JavaScript Unit Testing

My slides for the BASTA 2013 talk about JavaScript Unit Testing.

Sebastian Gingter

September 25, 2013
Tweet

More Decks by Sebastian Gingter

Other Decks in Programming

Transcript

  1. Sebastian P.R. Gingter | Smarthouse Media GmbH
    Mehrwert in Action:
    JavaScript Unit Testing

    View Slide

  2. Vorab:
    •  Sourcen und Demos @github
    –  https://github.com/gingters/BASTA2013_JSUnitTesting
    •  Slides @speackerdeck
    –  https://speakerdeck.com/phoenixhawk

    View Slide

  3. JavaScript Unit Testing
    Mehrwert in Action:
    Sebastian P.R. Gingter @PhoenixHawk #bastacon

    View Slide

  4. Agenda I
    •  Einleitung
    •  Demo I
    – Wie man ‚legacy‘ code testet
    •  Verfügbare Tools
    – Test frameworks & test runners

    View Slide

  5. Agenda II
    •  Die Toolchain für unsere Session
    – Und warum sie gewählt wurden
    •  Demo II
    – Was geht und wie gehts?
    •  The End J
    – Fragen & Antworten

    View Slide

  6. Einleitung
    •  Testing ist gut
    –  Oder: Warum sitzt ihr in dieser Session?
    •  Jeder kann test-driven entwickeln
    –  Aber das soll uns jetzt & hier nicht kümmern
    –  Wir sorgen uns eher um existierenden Code
    „[...], we can obviously say that starting with unit testing is
    much easier when starting something from scratch.“
    Jörn Zaefferer, QUnit

    View Slide

  7. Einleitung
    •  Probleme beim JS-Testing
    – JavaScript & Units ?
    – Inline Event Handlers
    – jQuery
    – DOM

    View Slide

  8. Testing (legacy) code & DOM
    Demo I

    View Slide

  9. Verfügbare Tools
    •  Test frameworks
    –  QUnit (jQuery)
    –  Mocha
    –  Jasmine
    –  JsUnit
    –  RhinoUnit
    –  Sinon
    –  JsSpec
    –  Jspec
    –  Screw.Unit
    –  ...

    View Slide

  10. Verfügbare Tools
    •  Test runners
    – Karma (früher Testacular)
    – Buster.js
    – TestSwarm
    – JsTestDriver
    – YUI Yeti
    – ...
    •  Grobe Übersicht:
    http://stackoverflow.com/questions/300855/javascript-unit-test-tools-for-tdd

    View Slide

  11. Verfügbare Tools
    •  Browser
    – Alle relevanten J
    – PhantomJS

    View Slide

  12. Unsere Toolchain
    •  Jasmine
    •  Karma

    View Slide

  13. Warum?
    •  Verbreitung
    •  Community
    •  Karma kommt von Google

    View Slide

  14. Woher?
    •  Node.js - http://nodejs.org/
    •  QUnit.js - http://qunitjs.com/
    •  Jasmine - http://pivotal.github.io/jasmine/
    •  Karma - http://karma-runner.github.io/
    •  PhantomJS - http://phantomjs.org/

    View Slide

  15. Node, Karma & Jasmine
    •  Node.js installieren
    •  npm install -g karma
    •  Optional:
    npm install -g jasmine-node

    View Slide

  16. CI Integration
    (am Beispiel von TeamCity)
    •  http://blog.danmerino.com/continuos-
    integration-ci-for-javascript-jasmine-
    and-teamcity/
    •  https://github.com/larrymyers/jasmine-
    reporters

    View Slide

  17. Was geht? Wie geht’s?
    Demo II

    View Slide

  18. Q & A?

    View Slide

  19. Last but not least:
    •  Twitter: @PhoenixHawk
    Hashtag: #bastacon
    •  Blog: gingter.org
    •  E-Mail: [email protected]

    View Slide

  20. VIELEN DANK!
    Mehrwert in Action: JavaScript Unit Testing

    View Slide