James Carr

First let me apologize for the delay in my posting. My intention was to post about a javascript testing framework each day, but the last couple of days I got a little stuck trying to get inspec to run.That coupled with the other things in life that compress my time I was just unable to make any progress! I finally decided to give up on inspec as it’s kind of specific to a certain domain (ServerJS) while my experiments have been rooted in the test driving of client side behavior. So, to move on, I’m going to do todays example using Screw.Unit!

The Dirty Details

Screw.Unit is another Behavior Driven Development framework that seems to have been around for awhile (but not as old as jsspec). It also has rails support via BlueRidge. Nifty.

License
As with just about all javascript frameworks, the MIT license.

Last Updated
July of 2008

Support
None found, but again you can contact the author for help (I assume)

Enough Blabber, Let’s See It!

To get going I’m going to just grab the zip file from the github page and extract it to my test directory. I assumed EXAMPLE.html is an example, so I went ahead and fired it up in firefox and saw some passing tests. Fair enough.

Let’s pop open the html file and see what lies beneath:

Those are the dependencies… hypothetically that’s all you need to include to get going.

We also get to see an example of writing a custom matcher:

Screw.Matchers["be_even"] = {
        match: function(expected, actual) {
          return actual % 2 == 0;
        },
        failure_message: function(expected, actual, not) {
          return 'expected ' + $.print(actual) + (not ? ' not' : '') + ' to be even';
        }
      }

jsspec and jspec both support custom matchers, but Screw.Unit is the first I’ve seen to include an example in it’s distribution. Props!

The rest is an example of using it… but I’ll skip that with my own example test driving the ol’ HTML5 placeholder attribute:

Screw.Unit(function() {
        // Tests are organized into 'describes' and 'its', following the style of RSpec.
        describe("Html5 Placeholder", function() {
          var sandbox = null;
          var emulator = null;
          var input = null;
          before(function(){
            sandbox = $('


');
            sandbox.append("
")
            emulator = new Html5Emulator();
            input = $('#name', sandbox);
          });
          it("should populate value with placeholder text", function() {
            emulator.emulatePlaceholders(sandbox);

            expect($('#name', sandbox).val()).to(equal, "Enter Name");
          });

          it("should blank the placeholder text on focus", function() {
            emulator.emulatePlaceholders(sandbox);

            input.focus();

            expect(input.val()).to(be_empty);
          });

          it("should return the placeholder text if the value is empty", function() {
            emulator.emulatePlaceholders(sandbox);

            input.focus();
            input.blur();

            expect(input.val()).to(equal, "Enter Name");
          });

          it("shouldn't return the placeholder text if the value is non-empty", function() {
            emulator.emulatePlaceholders(sandbox);

            input.focus();
            input.val("foo")
            input.blur();

            expect(input.val()).to(equal, "foo");
          });
        });
      });

It looks pretty close the non-dsl version of jspec, and it supports nested describes. Not bad! Like always, you can see the rest of this experiment on github.

What I LIked

I really liked the clean syntax and elegant design. I also really liked the illustrated examples of writing custom matchers and global befores.

• Nested Describes
• Global before/afters
• Clean easy to read Syntax

Cons

I didn’t notice any commandline runners that allow you to run specs outside of html. I think there are some third party rhino/spidermonky/etc runners out there, but I didn’t get to find them.

Summary

I’d probably pick this one as my favorite if it wasn’t for jspec’s commandline runner and custom DSL. The syntax is very clean and I was able to whip up an example in 15 minutes. The fact that it hasn’t been updated in almost a year is also worrisome especially in the rails community when projects that haven’t been updated in 4 months are considered stale. But overall, very good and very solid.

If you're new here, you may want to subscribe to my RSS feed. Thanks for visiting!

This entry was posted on Friday, June 12th, 2009 at 5:50 pm and is filed under Agile Software Development, Javascript, Test Driven Development, tdd-javascript-series. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.