From 69c4143effe26f1da18e0a19153a4a7c2c9e200f Mon Sep 17 00:00:00 2001 From: John Bintz Date: Tue, 13 Dec 2011 19:38:04 -0500 Subject: [PATCH] static presentation --- index.html | 88 ++++++++++++++++++++++++++++++++++-------------------- 1 file changed, 55 insertions(+), 33 deletions(-) diff --git a/index.html b/index.html index fdc5106..aa29787 100644 --- a/index.html +++ b/index.html @@ -115,8 +115,10 @@

Not so great in testing in "real" browsers

Fake DOMs aren't quite the same

-
-

Integration testing tools

+
+

(with the way I write tests, at least)

+
+

Full-stack Integration testing tools

  • Capybara
    • @@ -124,15 +126,15 @@
  • Selenium
-
-

Very thorough

-

Sloooooow

+

Very thorough

-

Server-side dependency management

+

Sloooooow

-

Sprockets

+

Server-side dependency management

+

Sprockets

+

Server-based testing tools

    @@ -140,29 +142,29 @@
  • jasmine-rails
-
-

Compiles assets for testing

+

Compiles assets for testing

+

Harder to automate

-
+

Continuous testing

  • Guard
-
-

A JS testing tool that...

+
+

What I wanted is a JS testing tool that...

  • Runs fast
    • -
  • In a real browser
    • +
  • In a real browser so I can use jQuery & Backbone straight
  • That supports modern Ruby webapp conventions
  • Is built for continuous testing
-
-

Enter jasmine-headless-webkit

+
+

jasmine-headless-webkit!

Installing

@@ -175,11 +177,23 @@

Gemfile

gem 'jasmine-headless-webkit', '~> 0.8.0'
-
-

Rails 3.1 Application

+
+

Rails 3.1 Application

+ +
    +
  • Asset pipeline using Sprockets
    • +
  • spec/javascripts holds tests
    • +
+
-

Legacy Jasmine gem support

+

The Pivotal Labs jasmine gem

+

spec/javascripts/support/jasmine.yml

+
+

Supporting the Jasmine gem conventions

+
+

(easier to convert existing projects to JHW)

+

spec/javascripts/support/jasmine.yml

src_dir: app/assets/javascripts
@@ -191,13 +205,13 @@ src_files: [ '**/*' ]
 spec_dir: spec/javascripts
 spec_files: [ '**/*[Ss]pec.*' ]
 helpers: [ 'helpers/**/*' ]
-
-

JavaScript Load Paths

-
-

Sprockets and Jasmine load files differently

-
-

The Sprockets Way

+

JavaScript Load Paths

+
+

Sprockets and Jasmine load files differently

+
+

The Sprockets Way

+

spec/javascripts/support/jasmine.yml

src_dir: app/assets/javascripts
@@ -205,19 +219,19 @@ asset_paths:
 - lib/assets/javascripts
 - vendor/assets/javascripts
 spec_dir: spec/javascripts
-
+
# ...somewhere in JHW...
 env.append_path "app/assets/javascripts"
 env.append_path "lib/assets/javascripts"
 env.append_path "vendor/assets/javascripts"
 env.append_path "spec/javascripts"
-
+
//= require backbone/models/cat
 //= require backbone/collections/cats
 //= require backbone/views/global_view
 
 class window.CatsView extends GlobalView
-
+

The Jasmine Way

src_dir: app/assets/javascripts
@@ -226,13 +240,13 @@ src_files: [ '**/*' ]
 spec_dir: spec/javascripts
 spec_files: [ '**/*[Ss]pec.*' ]
 helpers: [ 'helpers/**/*' ]
-
+
Dir["app/assets/javascripts/**/*"]
 Dir["spec/javascripts/**/*[Ss]pec.*"]
 Dir["spec/javascripts/helpers/**/*"]
-
+

JHW ensures that no file is loaded twice

-
+

Ensures Sprockets dependencies are loaded in the right order

Writing Jasmine Tests

@@ -290,8 +304,14 @@ end

Plenty of resources to learn Jasmine itself

-

tryjasmine.com

+

pivotal.github.com/jasmine

+

tryjasmine.com

+
+

For Backbone and Sinon.js

+ +

tinnedfruit.com/2011/03/03/testing-backbone-apps-with-jasmine-sinon.html

+

But once you know Jasmine...

Sprockets fun!

@@ -519,8 +539,10 @@ window.DefaultCatName = "Fluffy"

Learn more

    -
  • http://johnbintz.github.com/jasmine-headless-webkit/
    • -
  • http://tryjasmine.com/
    • +
  • johnbintz.github.com/jasmine-headless-webkit
    • +
  • pivotal.github.com/jasmine
    • +
  • tryjasmine.com
    • +
  • tinnedfruit.com/2011/03/03/testing-backbone-apps-with-jasmine-sinon.html