#261 Testing JavaScript with Jasmine

Definitely check out Evergreen (https://github.com/jnicklas/evergreen) too, it's jasmine without generated code and Coffescript support.

I've been using jasmine on a project. It's quite nice, and works pretty well. Though ive had problems when the code im testing uses jQuery. For example, i've had to switch $.each() to use a for loop instead because it couldnt recognize the window.$ function.

Thanks, Ryan! I've been really needing to add testing into my latest app that's damn near all jquery & rails 3. I appreciate you diving into this subject.

finally something i can use for testing my apps js. thank ryanb

I will show you another testing framework to javascript.

Spec.js is a testing framework built on top of Mozilla Rhino and Env.js. The idea is that you can run JavaScript tests without opening browsers, even for DOM manipulation.

http://rubygems.org/gems/spec-js

Exactly what I was looking for after adding jquery token input to my app!

Aaron - would love to talk to you about this. Jasmine doesn't do anything to $ at all and works fine w/ jQuery. We should be able to help you out.

And there are ways to run Jasmine specs headless if that's what you want to do.

Ryan - Thanks for featuring Jasmine!

@Jan, cool, I'll check out Evergreen. Thanks for the suggestion.

@Aaron, make sure that you're loading the files properly in the jasmine.yml file. Sounds like either jQuery isn't loaded or it's conflicting with something.

@Celestino, Jasmine isn't specific to the run environment, so you can use it without a browser as well. It is the Ruby gem which uses a browser based run environment.

Here's an example of using Node.js to test a jQuery plugin.

http://digitalbush.com/2011/03/29/testing-jquery-plugins-with-node-js-and-jasmine/

@ryan

I liked see Jasmine in practice. Spec.js is only another solution, and...

Thanks for all! ;)

I liked to see Jasmine too, but why are you use jquery selector for each action? It is very slow and ugly. Much better to cache the selector in the variables like this https://gist.github.com/916179

PS. sorry for my english

This is awesome. It's all going into my app tonight! Thanks Ryan!

worth pointing out that Diaspora has a bunch of jasmine specs if you want more examples!

https://github.com/diaspora/diaspora/tree/master/spec/javascripts

Check this out: https://github.com/johnbintz/jasmine-headless-webkit
It's allows to run specs without hitting a browser. It's lightning fast.

Although I ran rake jasmine, it doesnt seem to get my spec running. I named it piece_spec.js under the spec/javascripts/ folder... any clue?

I'm using rails 3.0.7 with Ruby 1.9.2

If you'd like a tutorial for Jasmine, here is one I made: http://evanhahn.com/tape/how_do_i_jasmine.html

Hope it helps!

A little late to the party here, but...:
Scratchin' my noggin' about the asset pipline here...
do I set the Jasmine YAML to point to app/assets/javascript?
Also, a nice post here: http://blog.carbonfive.com/2011/07/06/pragmatic-javascript-testing-with-jasmine/
note at the bottom about the jasmine-headless-webkit allowing cli spec running and CoffeeScript interpretation.

This is awesome. Ryan, How to use Jasmine in Rails 3.1?

Again, Thanks for all! :)

Here's something I grabbed from the Jasmine Google Group:

By default Jasmine will load files you place in spec/javascripts/helpers. You'll want to put the version of jquery that Rails provides (and jquery-ui, if you're using it) in there in order for Jasmine to be able to load it for your tests. Rails normally provides these to the asset pipeline via the jquery-rails gem, which jasmine doesn't yet interact with.

Hope this helps!

Thanks for using Jasmine!

Rajan

would love to see this updated for Rails 3 with asset pipeline and coffeescript. Or what's the current recommendation for js unit testing with rails?

hello, i think there is a little error in your tutorial,

src_files:
- public/javascripts/jquery.js

should be stored in /helpers and described in helper:

The path for the Jasmine Bundle doesn't work.

Just wanted to contribute a bit of info, and mention the Teaspoon project.

I used Jasmine for a long time (in Rails and non-Rails projects), but when Rails 3.0 came out it didn't work well with it, so I switched to Evergreen since it had the features that I needed at the time and used that for well over 2 years, but it lacks nice support for the Rails 3.1 asset pipeline (and it doesn't seem to be maintained anymore?). I switched to JasmineRice fairly recently and used Cucumber to run the javascript suite on CI, but that wasn't great either.

Anyway, I'm not a fan of switching testing frameworks (honestly), and ended up writing a test runner that had all the features that I wanted -- along with several others.

It utilizes the asset pipeline, uses PhantomJS to run headless (or you can use Selenium Webdriver).. It comes with support for Jasmine, Mocha, and QUnit. You can run it via a rake task, or in the browser -- and since it's running via the Rails server itself it can be used in a more integration sort of way -- testing json api's etc.

Anyway, that's my experience, and my attempt at a solid solution. Hopefully the project will help others.

https://github.com/modeset/teaspoon