Learn Frontend Testing

As a part of Formidable Labs’ series of development education events, I led a “Learn Frontend Testing” workshop on Oct. 16, 2013 for the SeattleJS meetup group. My slides are available at the following locations:

  • Web Presentation: A live, navigable reveal.js website. (Note: use the space bar to advance slides and arrow keys to navigate.)
  • PDF: A download-able PDF.

And, here’s an embedded format:

Workshop Topics

My presentation walks through testing some very basic JavaScript application code in the following steps:

  • Install all of the necessary test libraries and create a test driver HTML page to hook up the application libraries and run the whole test harness.
  • Create Mocha suites and tests.
  • Write assertions to verify application behavior with Chai.
  • Spy and stub out application behavior with Sinon.JS.
  • Automate all of our tests with PhantomJS to run them from the command line without a web browser.

The test stack the presentation uses is:

  • Mocha: Test framework for organizing and running our tests.
  • Chai: Natural language-focused test assertion library.
  • Sinon.JS: Test fake library providing spies and stubs for observing and mutating application behavior during tests.

The test concepts and technology stack is the same one I use in my book, Backbone.js Testing. You can see the additional test samples beyond those contained in the presentation at: http://backbone-testing.com/.

Try it Out!

All of the source code for the presentation (include our finished tests) is available at the workshop’s GitHub repo and can be installed using git:

$ git clone https://github.com/FormidableLabs/learn-frontend-testing.git