shared examples stored under spec/javascripts/.

Commentary

I tried the basic idea from thoughtbot as much as possible (it uses Underscore.js, but I think I don't need it yet)

So do I need to be able to pass all the needed variables (like body) from the jquery.validate.remote_spec to window.sharedExamples?

jquery.remote.validate_spec.js

describe("jQuery validate remote option", function() {
  var body, form;
  
  beforeEach(function() {
    body = $('body');
    
    spyOnEvent(body, 'signup:timeout');
    spyOnEvent(body, 'signup:connecting');
    spyOnEvent(body, 'signup:timeoutRecovery');
    
    loadFixtures('sign-up-form.fixture.html');
    form = $('#jasmine-fixtures form');
    form.tdSignUpForm({ debug: true });
  });
  
  describe("when there is no response on focus out", function() {
    beforeEach(function() {
      form.find('input#user_email').val('[email protected]');
      form.find('input#user_email').focusout();
      mostRecentAjaxRequest().response({}); //disconnected, so there is no response. We'll simulate it like this for now
      
      form.find('input#user_email').val('[email protected]');
    });
    
    it("should not show check icon", function() {
      expect(form).not.toContain('input#user_email + .icon.valid');
    });
    
    it("should not show error icon", function() {
      expect(form).not.toContain('input#user_email + .icon.error');
    });

    it("should trigger signup:timeout event", function() {
      expect('signup:timeout').toHaveBeenTriggeredOn(body);
    });
    
    describe("on focus out", function() {
      beforeEach(function() {
        form.find('input#user_email').focusout();
        mostRecentAjaxRequest().response({ status: 200 });
      });

      itShouldBehaveLike("remote revalidation");
    });
    
    describe("on submit", function() {
      beforeEach(function() {
        form.submit();
        mostRecentAjaxRequest().response({ status: 200 });
      });
      
      itShouldBehaveLike("remote revalidation");
    });
  });
});

jquery.remote.validate_spec_modified.js

describe("jQuery validate remote option", function() {
  var body, form, CONTEXT;
  
  beforeEach(function() {
    CONTEXT = {
      body: $('body')
    };
    
    spyOnEvent(body, 'signup:timeout');
    spyOnEvent(body, 'signup:connecting');
    spyOnEvent(body, 'signup:timeoutRecovery');
    
    loadFixtures('sign-up-form.fixture.html');
    form = $('#jasmine-fixtures form');
    form.tdSignUpForm({ debug: true });
  });
  
  describe("when there is no response on focus out", function() {
    beforeEach(function() {
      form.find('input#user_email').val('[email protected]');
      form.find('input#user_email').focusout();
      mostRecentAjaxRequest().response({}); //disconnected, so there is no response. We'll simulate it like this for now
      
      form.find('input#user_email').val('[email protected]');
    });
    
    it("should not show check icon", function() {
      expect(form).not.toContain('input#user_email + .icon.valid');
    });
    
    it("should not show error icon", function() {
      expect(form).not.toContain('input#user_email + .icon.error');
    });

    it("should trigger signup:timeout event", function() {
      expect('signup:timeout').toHaveBeenTriggeredOn(body);
    });
    
    describe("on focus out", function() {
      beforeEach(function() {
        form.find('input#user_email').focusout();
        mostRecentAjaxRequest().response({ status: 200 });
      });

      itShouldBehaveLike("remote revalidation", CONTEXT);
    });
    
    describe("on submit", function() {
      beforeEach(function() {
        form.submit();
        mostRecentAjaxRequest().response({ status: 200 });
      });
      
      itShouldBehaveLike("remote revalidation", CONTEXT);
    });
  });
});

sharedExamples.js

window.sharedExamples = {
  "remote revalidation": function() {
    var body = $('body');
        
    it("should revalidate", function() {
      expect(mostRecentAjaxRequest().url).toMatch(/%40trafficdito.com/);
    });
  
    it("should trigger signup:connecting event", function() {
      expect('signup:connecting').toHaveBeenTriggeredOn(body);
    });
  
    it("should trigger signup:timeoutRecovery event", function() {
      expect('signup:timeoutRecovery').toHaveBeenTriggeredOn(body);
    });
  }
};

function itShouldBehaveLike(testGroupName) {
  var testGroup = window.sharedExamples[testGroupName];
  
  if(testGroup) {
    return describe(testGroupName, function() {
      testGroup.apply(this);
    });
  } else {
    return it("cannot find shared behavior: '" + testGroupName + "'", function() {
      expect(false).toEqual(true);
    });
  }
};

sharedExamples_modified.js

window.sharedExamples = {
  "remote revalidation": function(CONTEXT) {
        
    it("should revalidate", function() {
      expect(mostRecentAjaxRequest().url).toMatch(/%40trafficdito.com/);
    });
  
    it("should trigger signup:connecting event", function() {
      expect('signup:connecting').toHaveBeenTriggeredOn(CONTEXT.body);
    });
  
    it("should trigger signup:timeoutRecovery event", function() {
      expect('signup:timeoutRecovery').toHaveBeenTriggeredOn(CONTEXT.body);
    });
  }
};

function itShouldBehaveLike(testGroupName, CONTEXT) {
  var testGroup = window.sharedExamples[testGroupName];
  
  if(testGroup) {
    return describe(testGroupName, function() {
      testGroup.apply(this, CONTEXT);
      //something like this, so I wont have to declare variable 'body' in window.sharedExamples["remote revalidation"]
      //CONTEXT should come from the spec.I just want to able to transfer the context so that they are customizable <<<<<<<< Is this overkill since $(body) can be accessed anyway from anywhere?
      //If it's going to be done, here problem I encountered:
      // --- var body = $('body') should be declared in the same depth (in the nest of describe()s/beforeEach()s) as where the function itShouldBehaveLike("remote revalidation", body) was called. Ergo, code repeat.

    });
  } else {
    return it("cannot find shared behavior: '" + testGroupName + "'", function() {
      expect(false).toEqual(true);
    });
  }
};