Tabs: Fixed issues with collapsible and active options.

diff --git a/tests/unit/tabs/tabs_options.js b/tests/unit/tabs/tabs_options.js
index ce556fc3eeed236dea587dc329e1713ca364d31c..3cce96e1c7b35e978e9a3e544a8da8b3fded606c 100644 (file)
--- a/tests/unit/tabs/tabs_options.js
+++ b/tests/unit/tabs/tabs_options.js
@@ -1,25 +1,122 @@
-/*
- * tabs_options.js
- */
-(function($) {
+(function( $ ) {
 
-module("tabs: options");
+module( "tabs: options" );
 
-test('collapsible', function() {
-       expect(4);
+test( "{ active: default }", function() {
+       expect( 4 );
+
+       var element = $( "#tabs1" ).tabs();
+       equals( element.tabs( "option", "active" ), 0, "should be 0 by default" );
+       tabs_state( element, 1, 0, 0 );
+       element.tabs( "destroy" );
+
+       window.location.hash = "#fragment-3";
+       element = $( "#tabs1" ).tabs();
+       equals( element.tabs( "option", "active" ), 2, "should be 2 based on URL" );
+       tabs_state( element, 0, 0, 1 );
+});
+
+test( "{ active: false }", function() {
+       expect( 7 );
+
+       var element = $( "#tabs1" ).tabs({
+               active: false,
+               collapsible: true
+       });
+       tabs_state( element, 0, 0, 0 );
+       equal( element.find( ".ui-tabs-nav .ui-state-active" ).size(), 0, "no tabs selected" );
+       strictEqual( element.tabs( "option", "active" ), false );
+
+       element.tabs( "option", "collapsible", false );
+       tabs_state( element, 1, 0, 0 );
+       equal( element.tabs( "option", "active" ), 0 );
+
+       element.tabs( "destroy" );
+       element.tabs({
+               active: false
+       });
+       tabs_state( element, 1, 0, 0 );
+       strictEqual( element.tabs( "option", "active" ), 0 );
+});
+
+test( "{ active: Number }", function() {
+       expect( 8 );
+
+       var element = $( "#tabs1" ).tabs({
+               active: 2
+       });
+       equals( element.tabs( "option", "active" ), 2 );
+       tabs_state( element, 0, 0, 1 );
+
+       element.tabs( "option", "active", 0 );
+       equals( element.tabs( "option", "active" ), 0 );
+       tabs_state( element, 1, 0, 0 );
 
-       el = $('#tabs1');
+       element.find( ".ui-tabs-nav a" ).eq( 1 ).click();
+       equals( element.tabs( "option", "active" ), 1 );
+       tabs_state( element, 0, 1, 0 );
 
-       el.tabs({ collapsible: true });
-       equals(el.tabs('option', 'collapsible'), true, 'option set');
-       ok(el.is('.ui-tabs-collapsible'), 'extra class "ui-tabs-collapsible" attached');
+       element.tabs( "option", "active", 10 );
+       equals( element.tabs( "option", "active" ), 1 );
+       tabs_state( element, 0, 1, 0 );
+});
+
+if ( $.uiBackCompat === false ) {
+       test( "{ active: -Number }", function() {
+               var element = $( "#tabs1" ).tabs({
+                       active: -1
+               });
+               equals( element.tabs( "option", "active" ), 2 );
+               tabs_state( element, 0, 0, 1 );
+
+               element.tabs( "option", "active", -2 );
+               equals( element.tabs( "option", "active" ), 1 );
+               tabs_state( element, 0, 1, 0 );
+
+               element.tabs( "option", "active", -10 );
+               equals( element.tabs( "option", "active" ), 1 );
+               tabs_state( element, 0, 1, 0 );
+
+               element.tabs( "option", "active", -3 );
+               equals( element.tabs( "option", "active" ), 0 );
+               tabs_state( element, 1, 0, 0 );
+       });
+}
+
+test( "{ collapsible: false }", function() {
+       expect( 4 );
+
+       var element = $( "#tabs1" ).tabs({
+               active: 1
+       });
+       element.tabs( "option", "active", false );
+       equal( element.tabs( "option", "active" ), 1 );
+       tabs_state( element, 0, 1, 0 );
+
+       element.find( ".ui-state-active a" ).eq( 1 ).click();
+       equal( element.tabs( "option", "active" ), 1 );
+       tabs_state( element, 0, 1, 0 );
+});
+
+test( "{ collapsible: true }", function() {
+       expect( 6 );
+
+       var element = $( "#tabs1" ).tabs({
+               active: 1,
+               collapsible: true
+       });
 
-       el.tabs('option', 'active', false);
-       equals($('div:hidden', '#tabs1').length, 3, 'all panels should be hidden');
+       element.tabs( "option", "active", false );
+       equal( element.tabs( "option", "active" ), false );
+       tabs_state( element, 0, 0, 0 );
 
-       el.tabs('option', 'collapsible', false);
-       ok(el.is(':not(.ui-tabs-collapsible)'), 'extra class "ui-tabs-collapsible" not attached');
+       element.tabs( "option", "active", 1 );
+       equal( element.tabs( "option", "active" ), 1 );
+       tabs_state( element, 0, 1, 0 );
 
+       element.find( ".ui-state-active a" ).click();
+       equal( element.tabs( "option", "active" ), false );
+       tabs_state( element, 0, 0, 0 );
 });
 
 test('disabled', function() {
@@ -46,34 +143,4 @@ test('fx', function() {
        ok(false, "missing test - untested code is broken code.");
 });
 
-test('active', function() {
-       expect(8);
-
-       el = $('#tabs1').tabs();
-       equals(el.tabs('option', 'active'), 0, 'should be 0 by default');
-
-       el.tabs('destroy');
-       el.tabs({ active: false });
-       equals(el.tabs('option', 'active'), false, 'should be false for all tabs deactive');
-       equals( $('li.ui-tabs-active', el).length, 0, 'no tab should be active' );
-       equals( $('div:hidden', '#tabs1').length, 3, 'all panels should be hidden' );
-
-       el.tabs('destroy');
-       el.tabs({ active: null });
-       equals(el.tabs('option', 'active'), false, 'should be false for all tabs deactive with value null (deprecated)');
-
-       el.tabs('destroy');
-       el.tabs({ active: 1 });
-       equals(el.tabs('option', 'active'), 1, 'should be specified tab');
-
-       el.tabs('destroy');
-       el.tabs({ active: 99 });
-       equals(el.tabs('option', 'active'), 0, 'active should default to zero if given value is out of index');
-
-       el.tabs('destroy');
-       el.tabs({ collapsible: true });
-       el.tabs('option', 'active', 0);
-       equals(el.tabs('option', 'active'), 0, 'should not collapse tab if value is same as active');
-});
-
 })(jQuery);

diff --git a/ui/jquery.ui.tabs.js b/ui/jquery.ui.tabs.js
index 646854f49ea0bdff35c4a401a1a544596f61b83c..699c1a5ee1800ccddb17bb62e174eb80b023bdd8 100755 (executable)
--- a/ui/jquery.ui.tabs.js
+++ b/ui/jquery.ui.tabs.js
@@ -78,6 +78,11 @@ $.widget( "ui.tabs", {
                }
                options.active = active;
 
+               // don't allow collapsible: false and active: false
+               if ( !options.collapsible && options.active === false ) {
+                       options.active = 0;
+               }
+
                // Take disabling tabs via class attribute from HTML
                // into account and update option properly.
                if ( $.isArray( options.disabled ) ) {
@@ -123,6 +128,11 @@ $.widget( "ui.tabs", {
                        return;
                }
 
+               // setting collapsible: false while collapsed; open first panel
+               if ( key === "collapsible" && !value && this.options.active === false ) {
+                       this._activate( 0 );
+               }
+
                this.options[ key ] = value;
                this.refresh();
        },