Pages

Tuesday, April 23, 2013

Jasmine spying on jQuery selectors

Quick blog post about how to spy for jQuery selectors. Say I want to write something like the following:
var $element = $('div.my-element');
How would you write a Jasmine specification to drive this line of code in a Backbone.View function? Here it is:
it("find the element using a jQuery selector", function() {
   var spy = spyOn(jQuery.fn, 'find');
   this.view.doSomething();
   expect(spy).toHaveBeenCalledWith('div.my-element');
});
The reason you can do this is that $(selector, context) becomes $(context).find(selector). By default, selectors perform their searches within the DOM starting at the document root. However, an alternate context can be given for the search by using the optional second parameter to the $() function (from http://api.jquery.com/jQuery/#jQuery1). Had to write this down in a blog so I remember it again some day. Cheers!

9 comments:

  1. thanks for share..

    ReplyDelete
    Replies
    1. Great Article android based projects

      Java Training in Chennai Project Center in Chennai Java Training in Chennai projects for cse The Angular Training covers a wide range of topics including Components, Angular Directives, Angular Services, Pipes, security fundamentals, Routing, and Angular programmability. The new Angular TRaining will lay the foundation you need to specialise in Single Page Application developer. Angular Training Project Centers in Chennai

      Delete
  2. Going to use 'spyOn(jQuery.fn, 'find')' today.... Thanks for documenting this! (Also - learned a new word today 'equitation' from your sidebar....)

    ReplyDelete
    Replies
    1. Good luck and cool on learning about equitation.

      Delete
  3. Thanks! Very nice stuff!

    ReplyDelete
  4. $("#updateActionCommentsModel div.modal-body div#actionCommentsModelSuccessMessage").load(
    form.attr('action'),
    formData,
    function(data, responseStatus) {
    i want to mock server call but run this function on success and failure
    }
    );

    ReplyDelete
  5. Hi, Great.. Tutorial is just awesome..It is really helpful for a newbie like me.. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging. If anyone wants to become a Front end developer learn from Javascript Training in Chennai . or learn thru Javascript Training in Chennai. Nowadays JavaScript has tons of job opportunities on various vertical industry. JavaScript Training in Chennai

    ReplyDelete