library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2025-01-07 20:34:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Tabs: Fixed issues with collapsible and active options.

Browse Source
This commit is contained in:
Scott González 2011-04-11 13:49:22 -04:00
parent a3370064d8
commit bc65675330
2 changed files with 122 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

151
tests/unit/tabs/tabs_options.js
View File

@ -1,25 +1,122 @@
/*
* tabs_options.js
*/
(function( $ ) {
module( "tabs: options" );
test('collapsible', function() {
test( "{ active: default }", function() {
expect( 4 );
el = $('#tabs1');
var element = $( "#tabs1" ).tabs();
equals( element.tabs( "option", "active" ), 0, "should be 0 by default" );
tabs_state( element, 1, 0, 0 );
element.tabs( "destroy" );
el.tabs({ collapsible: true });
equals(el.tabs('option', 'collapsible'), true, 'option set');
ok(el.is('.ui-tabs-collapsible'), 'extra class "ui-tabs-collapsible" attached');
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 );
});
el.tabs('option', 'active', false);
equals($('div:hidden', '#tabs1').length, 3, 'all panels should be hidden');
test( "{ active: false }", function() {
expect( 7 );
el.tabs('option', 'collapsible', false);
ok(el.is(':not(.ui-tabs-collapsible)'), 'extra class "ui-tabs-collapsible" not attached');
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 );
element.find( ".ui-tabs-nav a" ).eq( 1 ).click();
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 );
});
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
});
element.tabs( "option", "active", false );
equal( element.tabs( "option", "active" ), false );
tabs_state( element, 0, 0, 0 );
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);

10
ui/jquery.ui.tabs.js vendored
View File

@ -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();
},