Jasmine is a JavaScript testing framework that can be used with JavaScript and CoffeeScript. It provides tools like suites, specs, matchers, spies and mocks to test asynchronous functions. Guard is a tool that can be used to automatically run Jasmine tests when files change. Jasmine-headless-webkit runs Jasmine tests in a headless browser environment. Jasmine-jquery adds jQuery specific matchers, fixtures, and event spies to Jasmine. Jasmine-ajax helps test ajax requests by defining responses and expectations.

1. Testing JS with Jasmine
Jasmine itself and useful instruments

2. JavaScript
CoffeeScript

3. Jasmine instruments
Suites beforeEach
Specs afterEach
Matchers Spies
Custom Matchers Asynchronous specs

4. Jasmine instruments Spies
spyOn(...).andCallThrough()
spyOn(...).andReturn(arguments)
Spying spyOn(...).andThrow(exception)
Mocking spyOn(...).andCallFake(function)
Faking callCount
mostRecentCall.args
argsForCall[i]

5. Jasmine Asynchronous specs
runs(function)
waits(timeout)
waitsFor(function, optional message, optional timeout)

6. Jasmine minuses
Runs in browser
⌘+R (F5)
No fixtures
Static JS vs AssetPipeline
AJAX mocking isn’t friendly

7. Guard

8. Guard
Guard is a command line tool
to easily handle events on file modifications.
gem 'guard-rspec'
gem 'guard-annotate'
gem 'guard-bundler'
gem 'guard-rails-assets'
gem 'guard-jasmine-headless-webkit'

9. jasmine-headless-webkit

10. jasmine-headless-webkit
It integrates with Guard for a continuous testing setup.
It compiles CoffeeScript, both for your tests and for your application
logic.
It can be configured like RSpec, and its output is very similar to RSpec's
output.
It provides cleaner debugging and backtrace output than a lot of other
console-based test tools provide.
It's fast.

11. jasmine-headless-webkit
Needs Qt (actually this is not a problem but Qt compiles a lot of time)
-

12. jasmine-jquery

13. jasmine-jquery
Ads JQuery specific Matchers
Ads Fixtures
Ads Event Spies

14. jasmine-jquery Matchers
toBe selector toContain selector
toBeChecked toExist
toBeEmpty toHaveAttr name, value
toBeHidden toHaveClass className
toBeSelected toHandle eventName
toBeVisible etc...

15. jasmine-jquery Fixtures
<div id="my-fixture">some complex content here</div>
loadFixtures 'myfixture.html'
$('#my-fixture').myTestedPlugin()
expect($('#my-fixture')).to...

16. jasmine-jquery Event Spies
spyOnEvent $('#some_element'), 'click'
$('#some_element').click()
expect('click').toHaveBeenTriggeredOn $'#some_element'

17. jasmine-ajax

18. jasmine-ajax
1.Defining test responses
2.Installing the mock
3.Defining the response for each request
4.Inspecting Ajax requests and setting expectations on them

19. Time for code

20. Links
https://github.com/pivotal/jasmine/wiki
http://jashkenas.github.com/coffee-script/
http://johnbintz.github.com/jasmine-headless-webkit/
https://github.com/velesin/jasmine-jquery
https://github.com/pivotal/jasmine-ajax
https://github.com/guard/guard/wiki/List-of-available-Guards