" );
$.widget( "ui.testWidget", {
_create: function() {},
widget: function() {
return wrapper;
}
});
same( wrapper[0], $( "
" ).testWidget().testWidget( "widget" )[0] );
});
test( "._bind() to element (default)", function() {
expect( 12 );
var self;
$.widget( "ui.testWidget", {
_create: function() {
self = this;
this._bind({
keyup: this.keyup,
keydown: "keydown"
});
},
keyup: function( event ) {
equals( self, this );
equals( self.element[0], event.currentTarget );
equals( "keyup", event.type );
},
keydown: function( event ) {
equals( self, this );
equals( self.element[0], event.currentTarget );
equals( "keydown", event.type );
}
});
var widget = $( "
" )
.testWidget()
.trigger( "keyup" )
.trigger( "keydown" );
widget
.testWidget( "disable" )
.trigger( "keyup" )
.trigger( "keydown" );
widget
.testWidget( "enable" )
.trigger( "keyup" )
.trigger( "keydown" );
widget
.testWidget( "destroy" )
.trigger( "keyup" )
.trigger( "keydown" );
});
test( "._bind() to descendent", function() {
expect( 12 );
var self;
$.widget( "ui.testWidget", {
_create: function() {
self = this;
this._bind( this.element.find( "strong" ), {
keyup: this.keyup,
keydown: "keydown"
});
},
keyup: function( event ) {
equals( self, this );
equals( self.element.find( "strong" )[0], event.currentTarget );
equals( "keyup", event.type );
},
keydown: function(event) {
equals( self, this );
equals( self.element.find( "strong" )[0], event.currentTarget );
equals( "keydown", event.type );
}
});
// trigger events on both widget and descendent to ensure that only descendent receives them
var widget = $( "
" )
.testWidget()
.trigger( "keyup" )
.trigger( "keydown" );
var descendent = widget.find( "strong" )
.trigger( "keyup" )
.trigger( "keydown" );
widget
.testWidget( "disable" )
.trigger( "keyup" )
.trigger( "keydown" );
descendent
.trigger( "keyup" )
.trigger( "keydown" );
widget
.testWidget( "enable" )
.trigger( "keyup" )
.trigger( "keydown" );
descendent
.trigger( "keyup" )
.trigger( "keydown" );
descendent
.addClass( "ui-state-disabled" )
.trigger( "keyup" )
.trigger( "keydown" );
widget
.testWidget( "destroy" )
.trigger( "keyup" )
.trigger( "keydown" );
descendent
.trigger( "keyup" )
.trigger( "keydown" );
});
test( "._hoverable()", function() {
$.widget( "ui.testWidget", {
_create: function() {
this._hoverable( this.element.children() );
}
});
var div = $( "#widget" ).testWidget().children();
ok( !div.hasClass( "ui-state-hover" ), "not hovered on init" );
div.trigger( "mouseenter" );
ok( div.hasClass( "ui-state-hover" ), "hovered after mouseenter" );
div.trigger( "mouseleave" );
ok( !div.hasClass( "ui-state-hover" ), "not hovered after mouseleave" );
div.trigger( "mouseenter" );
ok( div.hasClass( "ui-state-hover" ), "hovered after mouseenter" );
$( "#widget" ).testWidget( "disable" );
ok( !div.hasClass( "ui-state-hover" ), "not hovered while disabled" );
div.trigger( "mouseenter" );
ok( !div.hasClass( "ui-state-hover" ), "can't hover while disabled" );
$( "#widget" ).testWidget( "enable" );
ok( !div.hasClass( "ui-state-hover" ), "enabling doesn't reset hover" );
div.trigger( "mouseenter" );
ok( div.hasClass( "ui-state-hover" ), "hovered after mouseenter" );
$( "#widget" ).testWidget( "destroy" );
ok( !div.hasClass( "ui-state-hover" ), "not hovered after destroy" );
div.trigger( "mouseenter" );
ok( !div.hasClass( "ui-state-hover" ), "event handler removed on destroy" );
});
test( "._focusable()", function() {
$.widget( "ui.testWidget", {
_create: function() {
this._focusable( this.element.children() );
}
});
var div = $( "#widget" ).testWidget().children();
ok( !div.hasClass( "ui-state-focus" ), "not focused on init" );
div.trigger( "focusin" );
ok( div.hasClass( "ui-state-focus" ), "focused after explicit focus" );
div.trigger( "focusout" );
ok( !div.hasClass( "ui-state-focus" ), "not focused after blur" );
div.trigger( "focusin" );
ok( div.hasClass( "ui-state-focus" ), "focused after explicit focus" );
$( "#widget" ).testWidget( "disable" );
ok( !div.hasClass( "ui-state-focus" ), "not focused while disabled" );
div.trigger( "focusin" );
ok( !div.hasClass( "ui-state-focus" ), "can't focus while disabled" );
$( "#widget" ).testWidget( "enable" );
ok( !div.hasClass( "ui-state-focus" ), "enabling doesn't reset focus" );
div.trigger( "focusin" );
ok( div.hasClass( "ui-state-focus" ), "focused after explicit focus" );
$( "#widget" ).testWidget( "destroy" );
ok( !div.hasClass( "ui-state-focus" ), "not focused after destroy" );
div.trigger( "focusin" );
ok( !div.hasClass( "ui-state-focus" ), "event handler removed on destroy" );
});
test( "._trigger() - no event, no ui", function() {
expect( 7 );
var handlers = [];
$.widget( "ui.testWidget", {
_create: function() {}
});
$( "#widget" ).testWidget({
foo: function( event, ui ) {
same( event.type, "testwidgetfoo", "correct event type in callback" );
same( ui, {}, "empty ui hash passed" );
handlers.push( "callback" );
}
});
$( document ).add( "#widget-wrapper" ).add( "#widget" )
.bind( "testwidgetfoo", function( event, ui ) {
same( ui, {}, "empty ui hash passed" );
handlers.push( this );
});
same( $( "#widget" ).data( "testWidget" )._trigger( "foo" ), true,
"_trigger returns true when event is not cancelled" );
same( handlers, [
$( "#widget" )[ 0 ],
$( "#widget-wrapper" )[ 0 ],
document,
"callback"
], "event bubbles and then invokes callback" );
$( document ).unbind( "testwidgetfoo" );
});
test( "._trigger() - cancelled event", function() {
expect( 3 );
$.widget( "ui.testWidget", {
_create: function() {}
});
$( "#widget" ).testWidget({
foo: function( event, ui ) {
ok( true, "callback invoked even if event is cancelled" );
}
})
.bind( "testwidgetfoo", function( event, ui ) {
ok( true, "event was triggered" );
return false;
});
same( $( "#widget" ).data( "testWidget" )._trigger( "foo" ), false,
"_trigger returns false when event is cancelled" );
});
test( "._trigger() - cancelled callback", function() {
$.widget( "ui.testWidget", {
_create: function() {}
});
$( "#widget" ).testWidget({
foo: function( event, ui ) {
return false;
}
});
same( $( "#widget" ).data( "testWidget" )._trigger( "foo" ), false,
"_trigger returns false when callback returns false" );
});
test( "._trigger() - provide event and ui", function() {
expect( 7 );
var originalEvent = $.Event( "originalTest" );
$.widget( "ui.testWidget", {
_create: function() {},
testEvent: function() {
var ui = {
foo: "bar",
baz: {
qux: 5,
quux: 20
}
};
this._trigger( "foo", originalEvent, ui );
same( ui, {
foo: "notbar",
baz: {
qux: 10,
quux: "jQuery"
}
}, "ui object modified" );
}
});
$( "#widget" ).bind( "testwidgetfoo", function( event, ui ) {
equal( event.originalEvent, originalEvent, "original event object passed" );
same( ui, {
foo: "bar",
baz: {
qux: 5,
quux: 20
}
}, "ui hash passed" );
ui.foo = "notbar";
});
$( "#widget-wrapper" ).bind( "testwidgetfoo", function( event, ui ) {
equal( event.originalEvent, originalEvent, "original event object passed" );
same( ui, {
foo: "notbar",
baz: {
qux: 5,
quux: 20
}
}, "modified ui hash passed" );
ui.baz.qux = 10;
});
$( "#widget" ).testWidget({
foo: function( event, ui ) {
equal( event.originalEvent, originalEvent, "original event object passed" );
same( ui, {
foo: "notbar",
baz: {
qux: 10,
quux: 20
}
}, "modified ui hash passed" );
ui.baz.quux = "jQuery";
}
})
.testWidget( "testEvent" );
});
test( "._trigger() - array as ui", function() {
// #6795 - Widget: handle array arguments to _trigger consistently
expect( 4 );
$.widget( "ui.testWidget", {
_create: function() {},
testEvent: function() {
var ui = {
foo: "bar",
baz: {
qux: 5,
quux: 20
}
};
var extra = {
bar: 5
};
this._trigger( "foo", null, [ ui, extra ] );
}
});
$( "#widget" ).bind( "testwidgetfoo", function( event, ui, extra ) {
same( ui, {
foo: "bar",
baz: {
qux: 5,
quux: 20
}
}, "event: ui hash passed" );
same( extra, {
bar: 5
}, "event: extra argument passed" );
});
$( "#widget" ).testWidget({
foo: function( event, ui, extra ) {
same( ui, {
foo: "bar",
baz: {
qux: 5,
quux: 20
}
}, "callback: ui hash passed" );
same( extra, {
bar: 5
}, "callback: extra argument passed" );
}
})
.testWidget( "testEvent" );
});
test( "._trigger() - instance as element", function() {
expect( 4 );
$.widget( "ui.testWidget", {
defaultElement: null,
testEvent: function() {
var ui = { foo: "bar" };
this._trigger( "foo", null, ui );
}
});
var instance = $.ui.testWidget({
foo: function( event, ui ) {
equal( event.type, "testwidgetfoo", "event object passed to callback" );
same( ui, { foo: "bar" }, "ui object passed to callback" );
}
});
$( instance ).bind( "testwidgetfoo", function( event, ui ) {
equal( event.type, "testwidgetfoo", "event object passed to event handler" );
same( ui, { foo: "bar" }, "ui object passed to event handler" );
});
instance.testEvent();
});
test( "auto-destroy - .remove()", function() {
expect( 1 );
$.widget( "ui.testWidget", {
_create: function() {},
destroy: function() {
ok( true, "destroyed from .remove()" );
}
});
$( "#widget" ).testWidget().remove();
});
test( "auto-destroy - .remove() on parent", function() {
expect( 1 );
$.widget( "ui.testWidget", {
_create: function() {},
destroy: function() {
ok( true, "destroyed from .remove() on parent" );
}
});
$( "#widget" ).testWidget().parent().remove();
});
test( "auto-destroy - .remove() on child", function() {
$.widget( "ui.testWidget", {
_create: function() {},
destroy: function() {
ok( false, "destroyed from .remove() on child" );
}
});
$( "#widget" ).testWidget().children().remove();
});
test( "auto-destroy - .empty()", function() {
$.widget( "ui.testWidget", {
_create: function() {},
destroy: function() {
ok( false, "destroyed from .empty()" );
}
});
$( "#widget" ).testWidget().empty();
});
test( "auto-destroy - .empty() on parent", function() {
expect( 1 );
$.widget( "ui.testWidget", {
_create: function() {},
destroy: function() {
ok( true, "destroyed from .empty() on parent" );
}
});
$( "#widget" ).testWidget().parent().empty();
});
test( "auto-destroy - .detach()", function() {
$.widget( "ui.testWidget", {
_create: function() {},
destroy: function() {
ok( false, "destroyed from .detach()" );
}
});
$( "#widget" ).testWidget().detach();
});
test( "redefine", function() {
expect( 4 );
$.widget( "ui.testWidget", {
method: function( str ) {
strictEqual( this, instance, "original invoked with correct this" );
equal( str, "bar", "original invoked with correct parameter" );
}
});
$.ui.testWidget.foo = "bar";
$.widget( "ui.testWidget", $.ui.testWidget, {
method: function( str ) {
equal( str, "foo", "new invoked with correct parameter" );
this._super( "method", "bar" );
}
});
var instance = new $.ui.testWidget();
instance.method( "foo" );
equal( $.ui.testWidget.foo, "bar", "static properties remain" );
});
}( jQuery ) );