How can I unit test anonymous callbacks passed to JavaScript functions?

Question

I'm creating a jQuery UI autocomplete widget passing in a callback function, like this:

input.autocomplete( {
    ...,
    select: function ( event, ui ) {
        valueField.val( ui.item.id );
    },
    ...
} );

How can I unit test the select function to assert that when it's called the valueField is updated with the correct value?

Bryan Oakley · Accepted Answer · 2013-08-20 21:37:07Z

1

If you're wanting to unit test your javascript, the best plan is to create first class functions for your callbacks.

answered Aug 20, 2013 at 21:37

Bryan Oakley

389k53 gold badges582 silver badges739 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

That would work, but then you lose the advantage of private or anonymous functions.

Very true. You get to decide which is more important to you.

Gareth Bowen · Accepted Answer · 2013-08-20 21:30:15Z

0

Using JsMockito you can capture the parameter passed in to the autocomplete function, eg:

var params;
when( input ).autocomplete().then( function ( p ) {
    params = p;
} );

By doing this you're saving the reference to the anonymous function, so you can call it later.

params.select( null, { item: { id: someId } } );
verify( valueField ).val( someId );

This technique can also be used for functions that are private, for example, when using the module pattern.

answered Aug 20, 2013 at 21:30

Gareth Bowen

9491 gold badge7 silver badges12 bronze badges