Widget: Use focusin/focusout for ._focusable().

diff --git a/tests/unit/widget/widget_core.js b/tests/unit/widget/widget_core.js
index b701193cf07526a5c283be308595c75a86cd3999..d993194e2c8da07df7beaf1be112244185c11ddc 100644 (file)
--- a/tests/unit/widget/widget_core.js
+++ b/tests/unit/widget/widget_core.js
@@ -137,7 +137,7 @@ test( "error handling", function() {
        $.error = error;
 });
 
-test("merge multiple option arguments", function() {
+test( "merge multiple option arguments", function() {
        expect( 1 );
        $.widget( "ui.testWidget", {
                _create: function() {
@@ -173,7 +173,7 @@ test("merge multiple option arguments", function() {
        });
 });
 
-test( "_getCreateOptions()", function() {
+test( "._getCreateOptions()", function() {
        expect( 1 );
        $.widget( "ui.testWidget", {
                options: {
@@ -488,6 +488,10 @@ test( "._bind() to descendent", function() {
        descendent
                .trigger( "keyup" )
                .trigger( "keydown" );
+       descendent
+               .addClass( "ui-state-disabled" )
+               .trigger( "keyup" )
+               .trigger( "keydown" );
        widget
                .testWidget( "destroy" )
                .trigger( "keyup" )
@@ -537,25 +541,25 @@ test( "._focusable()", function() {
        
        var div = $( "#widget" ).testWidget().children();
        ok( !div.hasClass( "ui-state-focus" ), "not focused on init" );
-       div.trigger( "focus" );
+       div.trigger( "focusin" );
        ok( div.hasClass( "ui-state-focus" ), "focused after explicit focus" );
-       div.trigger( "blur" );
+       div.trigger( "focusout" );
        ok( !div.hasClass( "ui-state-focus" ), "not focused after blur" );
        
-       div.trigger( "focus" );
+       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( "focus" );
+       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( "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( "focus" );
+       div.trigger( "focusin" );
        ok( !div.hasClass( "ui-state-focus" ), "event handler removed on destroy" );
 });
 

diff --git a/ui/jquery.ui.widget.js b/ui/jquery.ui.widget.js
index 1357d40f9853b09776e9c3fbf6fb18eebb835a04..4f092f9d8764bbd861a2118740bd37cac4e0c403 100644 (file)
--- a/ui/jquery.ui.widget.js
+++ b/ui/jquery.ui.widget.js
@@ -236,7 +236,11 @@ $.Widget.prototype = {
                var instance = this;
                $.each( handlers, function( event, handler ) {
                        element.bind( event + "." + instance.widgetName, function() {
-                               if ( instance.options.disabled ) {
+                               // allow widgets to customize the disabled handling
+                               // - disabled as an array instead of boolean
+                               // - disabled class as method for disabling individual parts
+                               if ( instance.options.disabled === true ||
+                                               $( this ).hasClass( "ui-state-disabled" ) ) {
                                        return;
                                }
                                return ( typeof handler === "string" ? instance[ handler ] : handler )
@@ -260,10 +264,10 @@ $.Widget.prototype = {
        _focusable: function( element ) {
                this.focusable = this.focusable.add( element );
                this._bind( element, {
-                       focus: function( event ) {
+                       focusin: function( event ) {
                                $( event.currentTarget ).addClass( "ui-state-focus" );
                        },
-                       blur: function( event ) {
+                       focusout: function( event ) {
                                $( event.currentTarget ).removeClass( "ui-state-focus" );
                        }
                });