getting started with advanced externs for jQueryUI

[Erik Blankinship]

I am trying to learn more about advanced externs for Closure Compiler by trying to make a rudimentary extern for JQueryUI (1.9.2). I am using the JQuery 1.8 extern to help.

So here is some silly code:

$( "#someSortable" ).sortable(
{   "cancel":".static",
    "change":function( event, ui )
    {   var thisindex = $( ui.helper ).index( );
    }
});
$( "#someSortable" ).disableSelection( );
$( "#someSortable" ).sortable( "refresh" );
$( "#someTabs" ).tabs( );

And here is my attempt at an extern:

/**
 * @param {Object|string} param
 * */
jQuery.prototype.sortable = function( param ) {};

jQuery.prototype.tabs = function() {};

The tabs compile okay, but the sortable runs into trouble:

WARNING - Property helper never defined on ui
WARNING - Property disableSelection never defined on jQuery

Any suggestions how to augment my javascript or my extern to make this work without warnings in closure compiler?

[Nick Santos]

On Mon, Dec 31, 2012 at 2:34 PM, Erik Blankinship <jedi...@gmail.com> wrote:
> WARNING - Property helper never defined on ui
> WARNING - Property disableSelection never defined on jQuery

Those warnings seem fairly self-explanatory to me. You need to define
'helper' and 'disableSelection' somewhere. Do you disagree with the
warnings? If so, why? Where do you expect those properties to be
defined?

Nick

[Erik Blankinship]

Ok, you were right :-), the first error was straightforward to implement:

jQuery.prototype.disableSelection = function( ) {};

However, I unfortunately remain confused about how and where to define the ui object.  Do I define the UI object in my extern or in my javascript code?

[Ilia Mirkin]

What is the ui object? What is the type of this object? Once you
figure that out, you can do:

"change": /** @param {jQuery.Event} event
@param {blatype} ui
*/

[Erik Blankinship]

On Mon, Dec 31, 2012 at 6:40 PM, Ilia Mirkin <imi...@alum.mit.edu> wrote:

What is the ui object? What is the type of this object?

In this case, ui is a javascript object with a variety of different keys and values.  One of the keys is helper, and its value is an element.

I am not sure how/where to represent an object with specific keys / values.    I tried:

"change":

/** @param {jQuery.Event} event

  @param {Object.<string,*>} ui

*/

function( event, ui )

{ var thisindex = $( ui.helper ).index( );

}

but, predictably, I get this error:

WARNING - Property helper never defined on Object.<*>

[Ilia Mirkin]

On Mon, Dec 31, 2012 at 9:31 PM, Erik Blankinship <jedi...@gmail.com> wrote:
>
> On Mon, Dec 31, 2012 at 6:40 PM, Ilia Mirkin <imi...@alum.mit.edu> wrote:
>>
>> What is the ui object? What is the type of this object?
>
>
> In this case, ui is a javascript object with a variety of different keys and
> values. One of the keys is helper, and its value is an element.

That's not good enough for closure compiler. It wants to know the
type. And if you don't want "helper" renamed, it had better match the
typename of one of the externs.

If you don't know the type, you can throw your hands up in the air,
and say ui['helper'], no questions asked. But then you lose any form
of type checking, etc.

[Erik Blankinship]

On Jan 1, 2013, at 2:08 AM, Ilia Mirkin <imi...@alum.mit.edu> wrote:

On Mon, Dec 31, 2012 at 9:31 PM, Erik Blankinship <jedi...@gmail.com> wrote:

On Mon, Dec 31, 2012 at 6:40 PM, Ilia Mirkin <imi...@alum.mit.edu> wrote:

What is the ui object? What is the type of this object?

In this case, ui is a javascript object with a variety of different keys and

values.  One of the keys is helper, and its value is an element.

That's not good enough for closure compiler. It wants to know the
type. And if you don't want "helper" renamed, it had better match the
typename of one of the externs.

If you don't know the type, you can throw your hands up in the air,
and say ui['helper'], no questions asked. But then you lose any form
of type checking, etc

I follow.  ui['helper'] sounds like the easy way out.

My ignorance on this matter is the syntax for how to represent an object with specific key/values and where to represent it.  @param {Object.<string,*>} ui was obviously not enough.   Would I expand this definition?  What would that look like? 

[Erik Blankinship]

On Tue, Jan 1, 2013 at 9:49 AM, Erik Blankinship <jedi...@gmail.com> wrote:

Would I expand this definition?  What would that look like? 

This worked for me:

/** @interface */

function Ui( ){}

/** @type {jQuerySelector} */

Ui.prototype.helper;

I put it in my nascent JQueryUI externs file.