mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-12-07 06:14:24 +00:00
parent
8029cc94e1
commit
009850abbf
@ -22,11 +22,11 @@ common.testWidget( "accordion", {
|
|||||||
"header": "ui-icon-triangle-1-e"
|
"header": "ui-icon-triangle-1-e"
|
||||||
},
|
},
|
||||||
|
|
||||||
// callbacks
|
// Callbacks
|
||||||
activate: null,
|
activate: null,
|
||||||
beforeActivate: null,
|
beforeActivate: null,
|
||||||
create: null
|
create: null
|
||||||
}
|
}
|
||||||
});
|
} );
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
@ -32,33 +32,33 @@ $.each( { div: "#list1", ul: "#navigation", dl: "#accordion-dl" }, function( typ
|
|||||||
deepEqual( element.find( ".ui-accordion-header" ).next().get(),
|
deepEqual( element.find( ".ui-accordion-header" ).next().get(),
|
||||||
element.find( ".ui-accordion-content" ).get(),
|
element.find( ".ui-accordion-content" ).get(),
|
||||||
"content panels come immediately after headers" );
|
"content panels come immediately after headers" );
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "handle click on header-descendant", function() {
|
test( "handle click on header-descendant", function() {
|
||||||
expect( 1 );
|
expect( 1 );
|
||||||
var element = $( "#navigation" ).accordion();
|
var element = $( "#navigation" ).accordion();
|
||||||
$( "#navigation h2:eq(1) a" ).trigger( "click" );
|
$( "#navigation h2:eq(1) a" ).trigger( "click" );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "accessibility", function () {
|
test( "accessibility", function() {
|
||||||
expect( 61 );
|
expect( 61 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: 1,
|
active: 1,
|
||||||
collapsible: true
|
collapsible: true
|
||||||
}),
|
} ),
|
||||||
headers = element.find( ".ui-accordion-header" );
|
headers = element.find( ".ui-accordion-header" );
|
||||||
|
|
||||||
equal( element.attr( "role" ), "tablist", "element role" );
|
equal( element.attr( "role" ), "tablist", "element role" );
|
||||||
headers.each(function( i ) {
|
headers.each( function( i ) {
|
||||||
var header = headers.eq( i ),
|
var header = headers.eq( i ),
|
||||||
panel = header.next();
|
panel = header.next();
|
||||||
equal( header.attr( "role" ), "tab", "header " + i + " role" );
|
equal( header.attr( "role" ), "tab", "header " + i + " role" );
|
||||||
equal( header.attr( "aria-controls" ), panel.attr( "id" ), "header " + i + " aria-controls" );
|
equal( header.attr( "aria-controls" ), panel.attr( "id" ), "header " + i + " aria-controls" );
|
||||||
equal( panel.attr( "role" ), "tabpanel", "panel " + i + " role" );
|
equal( panel.attr( "role" ), "tabpanel", "panel " + i + " role" );
|
||||||
equal( panel.attr( "aria-labelledby" ), header.attr( "id" ), "panel " + i + " aria-labelledby" );
|
equal( panel.attr( "aria-labelledby" ), header.attr( "id" ), "panel " + i + " aria-labelledby" );
|
||||||
});
|
} );
|
||||||
|
|
||||||
equal( headers.eq( 1 ).attr( "tabindex" ), 0, "active header has tabindex=0" );
|
equal( headers.eq( 1 ).attr( "tabindex" ), 0, "active header has tabindex=0" );
|
||||||
equal( headers.eq( 1 ).attr( "aria-selected" ), "true", "active tab (1) has aria-selected=true" );
|
equal( headers.eq( 1 ).attr( "aria-selected" ), "true", "active tab (1) has aria-selected=true" );
|
||||||
@ -115,7 +115,7 @@ test( "accessibility", function () {
|
|||||||
equal( headers.eq( 2 ).attr( "aria-expanded" ), "false", "inactive tab (2) has aria-expanded=false" );
|
equal( headers.eq( 2 ).attr( "aria-expanded" ), "false", "inactive tab (2) has aria-expanded=false" );
|
||||||
equal( headers.eq( 2 ).next().attr( "aria-hidden" ), "true", "inactive tabpanel (2) has aria-hidden=true" );
|
equal( headers.eq( 2 ).next().attr( "aria-hidden" ), "true", "inactive tabpanel (2) has aria-hidden=true" );
|
||||||
|
|
||||||
});
|
} );
|
||||||
|
|
||||||
asyncTest( "keyboard support", function( assert ) {
|
asyncTest( "keyboard support", function( assert ) {
|
||||||
expect( 13 );
|
expect( 13 );
|
||||||
@ -180,7 +180,7 @@ asyncTest( "keyboard support", function( assert ) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function step9() {
|
function step9() {
|
||||||
equal( element.accordion( "option", "active" ) , 2, "ENTER activates panel" );
|
equal( element.accordion( "option", "active" ), 2, "ENTER activates panel" );
|
||||||
headers.eq( 1 ).simulate( "keydown", { keyCode: keyCode.SPACE } );
|
headers.eq( 1 ).simulate( "keydown", { keyCode: keyCode.SPACE } );
|
||||||
setTimeout( step10 );
|
setTimeout( step10 );
|
||||||
}
|
}
|
||||||
@ -202,6 +202,6 @@ asyncTest( "keyboard support", function( assert ) {
|
|||||||
assert.hasClasses( headers.eq( 1 ), "ui-state-focus", "CTRL+UP moves focus to header" );
|
assert.hasClasses( headers.eq( 1 ), "ui-state-focus", "CTRL+UP moves focus to header" );
|
||||||
start();
|
start();
|
||||||
}
|
}
|
||||||
});
|
} );
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
@ -16,17 +16,17 @@ test( "create", function() {
|
|||||||
headers = element.children( "h3" ),
|
headers = element.children( "h3" ),
|
||||||
contents = headers.next();
|
contents = headers.next();
|
||||||
|
|
||||||
element.accordion({
|
element.accordion( {
|
||||||
create: function( event, ui ) {
|
create: function( event, ui ) {
|
||||||
equal( ui.header.length, 1, "header length" );
|
equal( ui.header.length, 1, "header length" );
|
||||||
strictEqual( ui.header[ 0 ], headers[ 0 ], "header" );
|
strictEqual( ui.header[ 0 ], headers[ 0 ], "header" );
|
||||||
equal( ui.panel.length, 1, "panel length" );
|
equal( ui.panel.length, 1, "panel length" );
|
||||||
strictEqual( ui.panel[ 0 ], contents[ 0 ], "panel" );
|
strictEqual( ui.panel[ 0 ], contents[ 0 ], "panel" );
|
||||||
}
|
}
|
||||||
});
|
} );
|
||||||
element.accordion( "destroy" );
|
element.accordion( "destroy" );
|
||||||
|
|
||||||
element.accordion({
|
element.accordion( {
|
||||||
active: 2,
|
active: 2,
|
||||||
create: function( event, ui ) {
|
create: function( event, ui ) {
|
||||||
equal( ui.header.length, 1, "header length" );
|
equal( ui.header.length, 1, "header length" );
|
||||||
@ -34,26 +34,26 @@ test( "create", function() {
|
|||||||
equal( ui.panel.length, 1, "panel length" );
|
equal( ui.panel.length, 1, "panel length" );
|
||||||
strictEqual( ui.panel[ 0 ], contents[ 2 ], "panel" );
|
strictEqual( ui.panel[ 0 ], contents[ 2 ], "panel" );
|
||||||
}
|
}
|
||||||
});
|
} );
|
||||||
element.accordion( "destroy" );
|
element.accordion( "destroy" );
|
||||||
|
|
||||||
element.accordion({
|
element.accordion( {
|
||||||
active: false,
|
active: false,
|
||||||
collapsible: true,
|
collapsible: true,
|
||||||
create: function( event, ui ) {
|
create: function( event, ui ) {
|
||||||
equal( ui.header.length, 0, "header length" );
|
equal( ui.header.length, 0, "header length" );
|
||||||
equal( ui.panel.length, 0, "panel length" );
|
equal( ui.panel.length, 0, "panel length" );
|
||||||
}
|
}
|
||||||
});
|
} );
|
||||||
element.accordion( "destroy" );
|
element.accordion( "destroy" );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "beforeActivate", function() {
|
test( "beforeActivate", function() {
|
||||||
expect( 38 );
|
expect( 38 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: false,
|
active: false,
|
||||||
collapsible: true
|
collapsible: true
|
||||||
}),
|
} ),
|
||||||
headers = element.find( ".ui-accordion-header" ),
|
headers = element.find( ".ui-accordion-header" ),
|
||||||
content = element.find( ".ui-accordion-content" );
|
content = element.find( ".ui-accordion-content" );
|
||||||
|
|
||||||
@ -66,7 +66,7 @@ test( "beforeActivate", function() {
|
|||||||
equal( ui.newPanel.length, 1 );
|
equal( ui.newPanel.length, 1 );
|
||||||
strictEqual( ui.newPanel[ 0 ], content[ 0 ] );
|
strictEqual( ui.newPanel[ 0 ], content[ 0 ] );
|
||||||
state( element, 0, 0, 0 );
|
state( element, 0, 0, 0 );
|
||||||
});
|
} );
|
||||||
element.accordion( "option", "active", 0 );
|
element.accordion( "option", "active", 0 );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
|
|
||||||
@ -81,7 +81,7 @@ test( "beforeActivate", function() {
|
|||||||
equal( ui.newPanel.length, 1 );
|
equal( ui.newPanel.length, 1 );
|
||||||
strictEqual( ui.newPanel[ 0 ], content[ 1 ] );
|
strictEqual( ui.newPanel[ 0 ], content[ 1 ] );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
});
|
} );
|
||||||
headers.eq( 1 ).trigger( "click" );
|
headers.eq( 1 ).trigger( "click" );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
|
|
||||||
@ -94,7 +94,7 @@ test( "beforeActivate", function() {
|
|||||||
equal( ui.newHeader.length, 0 );
|
equal( ui.newHeader.length, 0 );
|
||||||
equal( ui.newPanel.length, 0 );
|
equal( ui.newPanel.length, 0 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
});
|
} );
|
||||||
element.accordion( "option", "active", false );
|
element.accordion( "option", "active", false );
|
||||||
state( element, 0, 0, 0 );
|
state( element, 0, 0, 0 );
|
||||||
|
|
||||||
@ -108,17 +108,17 @@ test( "beforeActivate", function() {
|
|||||||
strictEqual( ui.newPanel[ 0 ], content[ 2 ] );
|
strictEqual( ui.newPanel[ 0 ], content[ 2 ] );
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
state( element, 0, 0, 0 );
|
state( element, 0, 0, 0 );
|
||||||
});
|
} );
|
||||||
element.accordion( "option", "active", 2 );
|
element.accordion( "option", "active", 2 );
|
||||||
state( element, 0, 0, 0 );
|
state( element, 0, 0, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "activate", function() {
|
test( "activate", function() {
|
||||||
expect( 21 );
|
expect( 21 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: false,
|
active: false,
|
||||||
collapsible: true
|
collapsible: true
|
||||||
}),
|
} ),
|
||||||
headers = element.find( ".ui-accordion-header" ),
|
headers = element.find( ".ui-accordion-header" ),
|
||||||
content = element.find( ".ui-accordion-content" );
|
content = element.find( ".ui-accordion-content" );
|
||||||
|
|
||||||
@ -129,7 +129,7 @@ test( "activate", function() {
|
|||||||
strictEqual( ui.newHeader[ 0 ], headers[ 0 ] );
|
strictEqual( ui.newHeader[ 0 ], headers[ 0 ] );
|
||||||
equal( ui.newPanel.length, 1 );
|
equal( ui.newPanel.length, 1 );
|
||||||
strictEqual( ui.newPanel[ 0 ], content[ 0 ] );
|
strictEqual( ui.newPanel[ 0 ], content[ 0 ] );
|
||||||
});
|
} );
|
||||||
element.accordion( "option", "active", 0 );
|
element.accordion( "option", "active", 0 );
|
||||||
|
|
||||||
element.one( "accordionactivate", function( event, ui ) {
|
element.one( "accordionactivate", function( event, ui ) {
|
||||||
@ -141,7 +141,7 @@ test( "activate", function() {
|
|||||||
strictEqual( ui.newHeader[ 0 ], headers[ 1 ] );
|
strictEqual( ui.newHeader[ 0 ], headers[ 1 ] );
|
||||||
equal( ui.newPanel.length, 1 );
|
equal( ui.newPanel.length, 1 );
|
||||||
strictEqual( ui.newPanel[ 0 ], content[ 1 ] );
|
strictEqual( ui.newPanel[ 0 ], content[ 1 ] );
|
||||||
});
|
} );
|
||||||
headers.eq( 1 ).trigger( "click" );
|
headers.eq( 1 ).trigger( "click" );
|
||||||
|
|
||||||
element.one( "accordionactivate", function( event, ui ) {
|
element.one( "accordionactivate", function( event, ui ) {
|
||||||
@ -151,18 +151,18 @@ test( "activate", function() {
|
|||||||
strictEqual( ui.oldPanel[ 0 ], content[ 1 ] );
|
strictEqual( ui.oldPanel[ 0 ], content[ 1 ] );
|
||||||
equal( ui.newHeader.length, 0 );
|
equal( ui.newHeader.length, 0 );
|
||||||
equal( ui.newPanel.length, 0 );
|
equal( ui.newPanel.length, 0 );
|
||||||
});
|
} );
|
||||||
element.accordion( "option", "active", false );
|
element.accordion( "option", "active", false );
|
||||||
|
|
||||||
// prevent activation
|
// Prevent activation
|
||||||
element.one( "accordionbeforeactivate", function( event ) {
|
element.one( "accordionbeforeactivate", function( event ) {
|
||||||
ok( true );
|
ok( true );
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
});
|
} );
|
||||||
element.one( "accordionactivate", function() {
|
element.one( "accordionactivate", function() {
|
||||||
ok( false );
|
ok( false );
|
||||||
});
|
} );
|
||||||
element.accordion( "option", "active", 1 );
|
element.accordion( "option", "active", 1 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
@ -6,9 +6,9 @@ define( [
|
|||||||
|
|
||||||
return $.extend( helper, {
|
return $.extend( helper, {
|
||||||
equalHeight: function( accordion, height ) {
|
equalHeight: function( accordion, height ) {
|
||||||
accordion.find( ".ui-accordion-content" ).each(function() {
|
accordion.find( ".ui-accordion-content" ).each( function() {
|
||||||
equal( $( this ).outerHeight(), height );
|
equal( $( this ).outerHeight(), height );
|
||||||
});
|
} );
|
||||||
},
|
},
|
||||||
|
|
||||||
setupTeardown: function() {
|
setupTeardown: function() {
|
||||||
@ -25,10 +25,10 @@ return $.extend( helper, {
|
|||||||
|
|
||||||
state: function( accordion ) {
|
state: function( accordion ) {
|
||||||
var expected = $.makeArray( arguments ).slice( 1 ),
|
var expected = $.makeArray( arguments ).slice( 1 ),
|
||||||
actual = accordion.find( ".ui-accordion-content" ).map(function() {
|
actual = accordion.find( ".ui-accordion-content" ).map( function() {
|
||||||
return $( this ).css( "display" ) === "none" ? 0 : 1;
|
return $( this ).css( "display" ) === "none" ? 0 : 1;
|
||||||
}).get();
|
} ).get();
|
||||||
QUnit.push( QUnit.equiv(actual, expected), actual, expected );
|
QUnit.push( QUnit.equiv( actual, expected ), actual, expected );
|
||||||
}
|
}
|
||||||
} );
|
} );
|
||||||
|
|
||||||
|
@ -14,8 +14,8 @@ test( "destroy", function( assert ) {
|
|||||||
expect( 1 );
|
expect( 1 );
|
||||||
assert.domEqual( "#list1", function() {
|
assert.domEqual( "#list1", function() {
|
||||||
$( "#list1" ).accordion().accordion( "destroy" );
|
$( "#list1" ).accordion().accordion( "destroy" );
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "enable/disable", function( assert ) {
|
test( "enable/disable", function( assert ) {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
@ -28,16 +28,17 @@ test( "enable/disable", function( assert ) {
|
|||||||
equal( element.attr( "aria-disabled" ), "true", "element gets aria-disabled" );
|
equal( element.attr( "aria-disabled" ), "true", "element gets aria-disabled" );
|
||||||
assert.hasClasses( element, "ui-accordion-disabled" );
|
assert.hasClasses( element, "ui-accordion-disabled" );
|
||||||
|
|
||||||
// event does nothing
|
// Event does nothing
|
||||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" );
|
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
// option still works
|
|
||||||
|
// Option still works
|
||||||
element.accordion( "option", "active", 1 );
|
element.accordion( "option", "active", 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
element.accordion( "enable" );
|
element.accordion( "enable" );
|
||||||
element.accordion( "option", "active", 2 );
|
element.accordion( "option", "active", 2 );
|
||||||
state( element, 0, 0, 1 );
|
state( element, 0, 0, 1 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "refresh", function() {
|
test( "refresh", function() {
|
||||||
expect( 19 );
|
expect( 19 );
|
||||||
@ -45,9 +46,9 @@ test( "refresh", function() {
|
|||||||
.parent()
|
.parent()
|
||||||
.height( 300 )
|
.height( 300 )
|
||||||
.end()
|
.end()
|
||||||
.accordion({
|
.accordion( {
|
||||||
heightStyle: "fill"
|
heightStyle: "fill"
|
||||||
});
|
} );
|
||||||
equalHeight( element, 255 );
|
equalHeight( element, 255 );
|
||||||
|
|
||||||
element.parent().height( 500 );
|
element.parent().height( 500 );
|
||||||
@ -58,72 +59,72 @@ test( "refresh", function() {
|
|||||||
element.accordion();
|
element.accordion();
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
|
|
||||||
// disable panel via markup
|
// Disable panel via markup
|
||||||
element.find( "h3.bar" ).eq( 1 ).addClass( "ui-state-disabled" );
|
element.find( "h3.bar" ).eq( 1 ).addClass( "ui-state-disabled" );
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
|
|
||||||
// don't add multiple icons
|
// Don't add multiple icons
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
equal( element.find( ".ui-accordion-header-icon" ).length, 3 );
|
equal( element.find( ".ui-accordion-header-icon" ).length, 3 );
|
||||||
|
|
||||||
// add a panel
|
// Add a panel
|
||||||
element
|
element
|
||||||
.append("<h3 class='bar' id='new_1'>new 1</h3>")
|
.append( "<h3 class='bar' id='new_1'>new 1</h3>" )
|
||||||
.append("<div class='foo' id='new_1_panel'>new 1</div>");
|
.append( "<div class='foo' id='new_1_panel'>new 1</div>" );
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element, 1, 0, 0, 0 );
|
state( element, 1, 0, 0, 0 );
|
||||||
|
|
||||||
// remove all tabs
|
// Remove all tabs
|
||||||
element.find( "h3.bar, div.foo" ).remove();
|
element.find( "h3.bar, div.foo" ).remove();
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element );
|
state( element );
|
||||||
equal( element.accordion( "option", "active" ), false, "no active accordion panel" );
|
equal( element.accordion( "option", "active" ), false, "no active accordion panel" );
|
||||||
|
|
||||||
// add panels
|
// Add panels
|
||||||
element
|
element
|
||||||
.append("<h3 class='bar' id='new_2'>new 2</h3>")
|
.append( "<h3 class='bar' id='new_2'>new 2</h3>" )
|
||||||
.append("<div class='foo' id='new_2_panel'>new 2</div>")
|
.append( "<div class='foo' id='new_2_panel'>new 2</div>" )
|
||||||
.append("<h3 class='bar' id='new_3'>new 3</h3>")
|
.append( "<h3 class='bar' id='new_3'>new 3</h3>" )
|
||||||
.append("<div class='foo' id='new_3_panel'>new 3</div>")
|
.append( "<div class='foo' id='new_3_panel'>new 3</div>" )
|
||||||
.append("<h3 class='bar' id='new_4'>new 4</h3>")
|
.append( "<h3 class='bar' id='new_4'>new 4</h3>" )
|
||||||
.append("<div class='foo' id='new_4_panel'>new 4</div>")
|
.append( "<div class='foo' id='new_4_panel'>new 4</div>" )
|
||||||
.append("<h3 class='bar' id='new_5'>new 5</h3>")
|
.append( "<h3 class='bar' id='new_5'>new 5</h3>" )
|
||||||
.append("<div class='foo' id='new_5_panel'>new 5</div>");
|
.append( "<div class='foo' id='new_5_panel'>new 5</div>" );
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element, 1, 0, 0, 0 );
|
state( element, 1, 0, 0, 0 );
|
||||||
|
|
||||||
// activate third tab
|
// Activate third tab
|
||||||
element.accordion( "option", "active", 2 );
|
element.accordion( "option", "active", 2 );
|
||||||
state( element, 0, 0, 1, 0 );
|
state( element, 0, 0, 1, 0 );
|
||||||
|
|
||||||
// remove fourth panel, third panel should stay active
|
// Remove fourth panel, third panel should stay active
|
||||||
element.find( "h3.bar" ).eq( 3 ).remove();
|
element.find( "h3.bar" ).eq( 3 ).remove();
|
||||||
element.find( "div.foo" ).eq( 3 ).remove();
|
element.find( "div.foo" ).eq( 3 ).remove();
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element, 0, 0, 1 );
|
state( element, 0, 0, 1 );
|
||||||
|
|
||||||
// remove third (active) panel, second panel should become active
|
// Remove third (active) panel, second panel should become active
|
||||||
element.find( "h3.bar" ).eq( 2 ).remove();
|
element.find( "h3.bar" ).eq( 2 ).remove();
|
||||||
element.find( "div.foo" ).eq( 2 ).remove();
|
element.find( "div.foo" ).eq( 2 ).remove();
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element, 0, 1 );
|
state( element, 0, 1 );
|
||||||
|
|
||||||
// remove first panel, previously active panel (now first) should stay active
|
// Remove first panel, previously active panel (now first) should stay active
|
||||||
element.find( "h3.bar" ).eq( 0 ).remove();
|
element.find( "h3.bar" ).eq( 0 ).remove();
|
||||||
element.find( "div.foo" ).eq( 0 ).remove();
|
element.find( "div.foo" ).eq( 0 ).remove();
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element, 1 );
|
state( element, 1 );
|
||||||
|
|
||||||
// collapse all panels
|
// Collapse all panels
|
||||||
element.accordion( "option", {
|
element.accordion( "option", {
|
||||||
collapsible: true,
|
collapsible: true,
|
||||||
active: false
|
active: false
|
||||||
});
|
} );
|
||||||
state( element, 0 );
|
state( element, 0 );
|
||||||
element.accordion( "refresh" );
|
element.accordion( "refresh" );
|
||||||
state( element, 0 );
|
state( element, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "widget", function() {
|
test( "widget", function() {
|
||||||
expect( 2 );
|
expect( 2 );
|
||||||
@ -131,6 +132,6 @@ test( "widget", function() {
|
|||||||
widgetElement = element.accordion( "widget" );
|
widgetElement = element.accordion( "widget" );
|
||||||
equal( widgetElement.length, 1, "one element" );
|
equal( widgetElement.length, 1, "one element" );
|
||||||
strictEqual( widgetElement[ 0 ], element[ 0 ], "same element" );
|
strictEqual( widgetElement[ 0 ], element[ 0 ], "same element" );
|
||||||
});
|
} );
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
@ -15,23 +15,23 @@ test( "{ active: default }", function() {
|
|||||||
var element = $( "#list1" ).accordion();
|
var element = $( "#list1" ).accordion();
|
||||||
equal( element.accordion( "option", "active" ), 0 );
|
equal( element.accordion( "option", "active" ), 0 );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ active: null }", function() {
|
test( "{ active: null }", function() {
|
||||||
expect( 2 );
|
expect( 2 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: null
|
active: null
|
||||||
});
|
} );
|
||||||
equal( element.accordion( "option", "active" ), 0 );
|
equal( element.accordion( "option", "active" ), 0 );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ active: false }", function() {
|
test( "{ active: false }", function() {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: false,
|
active: false,
|
||||||
collapsible: true
|
collapsible: true
|
||||||
});
|
} );
|
||||||
state( element, 0, 0, 0 );
|
state( element, 0, 0, 0 );
|
||||||
equal( element.find( ".ui-accordion-header.ui-state-active" ).length, 0, "no headers selected" );
|
equal( element.find( ".ui-accordion-header.ui-state-active" ).length, 0, "no headers selected" );
|
||||||
equal( element.accordion( "option", "active" ), false );
|
equal( element.accordion( "option", "active" ), false );
|
||||||
@ -41,18 +41,18 @@ test( "{ active: false }", function() {
|
|||||||
equal( element.accordion( "option", "active" ), 0 );
|
equal( element.accordion( "option", "active" ), 0 );
|
||||||
|
|
||||||
element.accordion( "destroy" );
|
element.accordion( "destroy" );
|
||||||
element.accordion({
|
element.accordion( {
|
||||||
active: false
|
active: false
|
||||||
});
|
} );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
strictEqual( element.accordion( "option", "active" ), 0 );
|
strictEqual( element.accordion( "option", "active" ), 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ active: Number }", function() {
|
test( "{ active: Number }", function() {
|
||||||
expect( 8 );
|
expect( 8 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: 2
|
active: 2
|
||||||
});
|
} );
|
||||||
equal( element.accordion( "option", "active" ), 2 );
|
equal( element.accordion( "option", "active" ), 2 );
|
||||||
state( element, 0, 0, 1 );
|
state( element, 0, 0, 1 );
|
||||||
|
|
||||||
@ -67,13 +67,13 @@ test( "{ active: Number }", function() {
|
|||||||
element.accordion( "option", "active", 10 );
|
element.accordion( "option", "active", 10 );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ active: -Number }", function() {
|
test( "{ active: -Number }", function() {
|
||||||
expect( 8 );
|
expect( 8 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: -1
|
active: -1
|
||||||
});
|
} );
|
||||||
equal( element.accordion( "option", "active" ), 2 );
|
equal( element.accordion( "option", "active" ), 2 );
|
||||||
state( element, 0, 0, 1 );
|
state( element, 0, 0, 1 );
|
||||||
|
|
||||||
@ -88,13 +88,13 @@ test( "{ active: -Number }", function() {
|
|||||||
element.accordion( "option", "active", -3 );
|
element.accordion( "option", "active", -3 );
|
||||||
equal( element.accordion( "option", "active" ), 0 );
|
equal( element.accordion( "option", "active" ), 0 );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ animate: false }", function() {
|
test( "{ animate: false }", function() {
|
||||||
expect( 3 );
|
expect( 3 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
animate: false
|
animate: false
|
||||||
}),
|
} ),
|
||||||
panels = element.find( ".ui-accordion-content" ),
|
panels = element.find( ".ui-accordion-content" ),
|
||||||
animate = $.fn.animate;
|
animate = $.fn.animate;
|
||||||
$.fn.animate = function() {
|
$.fn.animate = function() {
|
||||||
@ -106,16 +106,17 @@ test( "{ animate: false }", function() {
|
|||||||
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
||||||
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
||||||
$.fn.animate = animate;
|
$.fn.animate = animate;
|
||||||
});
|
} );
|
||||||
|
|
||||||
asyncTest( "{ animate: Number }", function() {
|
asyncTest( "{ animate: Number }", function() {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
animate: 100
|
animate: 100
|
||||||
}),
|
} ),
|
||||||
panels = element.find( ".ui-accordion-content" ),
|
panels = element.find( ".ui-accordion-content" ),
|
||||||
animate = $.fn.animate;
|
animate = $.fn.animate;
|
||||||
// called twice (both panels)
|
|
||||||
|
// Called twice (both panels)
|
||||||
$.fn.animate = function( props, options ) {
|
$.fn.animate = function( props, options ) {
|
||||||
equal( options.duration, 100, "correct duration" );
|
equal( options.duration, 100, "correct duration" );
|
||||||
equal( options.easing, undefined, "default easing" );
|
equal( options.easing, undefined, "default easing" );
|
||||||
@ -124,22 +125,23 @@ asyncTest( "{ animate: Number }", function() {
|
|||||||
|
|
||||||
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
||||||
element.accordion( "option", "active", 1 );
|
element.accordion( "option", "active", 1 );
|
||||||
panels.promise().done(function() {
|
panels.promise().done( function() {
|
||||||
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
||||||
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
||||||
$.fn.animate = animate;
|
$.fn.animate = animate;
|
||||||
start();
|
start();
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
asyncTest( "{ animate: String }", function() {
|
asyncTest( "{ animate: String }", function() {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
animate: "linear"
|
animate: "linear"
|
||||||
}),
|
} ),
|
||||||
panels = element.find( ".ui-accordion-content" ),
|
panels = element.find( ".ui-accordion-content" ),
|
||||||
animate = $.fn.animate;
|
animate = $.fn.animate;
|
||||||
// called twice (both panels)
|
|
||||||
|
// Called twice (both panels)
|
||||||
$.fn.animate = function( props, options ) {
|
$.fn.animate = function( props, options ) {
|
||||||
equal( options.duration, undefined, "default duration" );
|
equal( options.duration, undefined, "default duration" );
|
||||||
equal( options.easing, "linear", "correct easing" );
|
equal( options.easing, "linear", "correct easing" );
|
||||||
@ -148,22 +150,23 @@ asyncTest( "{ animate: String }", function() {
|
|||||||
|
|
||||||
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
||||||
element.accordion( "option", "active", 1 );
|
element.accordion( "option", "active", 1 );
|
||||||
panels.promise().done(function() {
|
panels.promise().done( function() {
|
||||||
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
||||||
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
||||||
$.fn.animate = animate;
|
$.fn.animate = animate;
|
||||||
start();
|
start();
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
asyncTest( "{ animate: {} }", function() {
|
asyncTest( "{ animate: {} }", function() {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
animate: {}
|
animate: {}
|
||||||
}),
|
} ),
|
||||||
panels = element.find( ".ui-accordion-content" ),
|
panels = element.find( ".ui-accordion-content" ),
|
||||||
animate = $.fn.animate;
|
animate = $.fn.animate;
|
||||||
// called twice (both panels)
|
|
||||||
|
// Called twice (both panels)
|
||||||
$.fn.animate = function( props, options ) {
|
$.fn.animate = function( props, options ) {
|
||||||
equal( options.duration, undefined, "default duration" );
|
equal( options.duration, undefined, "default duration" );
|
||||||
equal( options.easing, undefined, "default easing" );
|
equal( options.easing, undefined, "default easing" );
|
||||||
@ -172,22 +175,23 @@ asyncTest( "{ animate: {} }", function() {
|
|||||||
|
|
||||||
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
||||||
element.accordion( "option", "active", 1 );
|
element.accordion( "option", "active", 1 );
|
||||||
panels.promise().done(function() {
|
panels.promise().done( function() {
|
||||||
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
||||||
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
||||||
$.fn.animate = animate;
|
$.fn.animate = animate;
|
||||||
start();
|
start();
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
asyncTest( "{ animate: { duration, easing } }", function() {
|
asyncTest( "{ animate: { duration, easing } }", function() {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
animate: { duration: 100, easing: "linear" }
|
animate: { duration: 100, easing: "linear" }
|
||||||
}),
|
} ),
|
||||||
panels = element.find( ".ui-accordion-content" ),
|
panels = element.find( ".ui-accordion-content" ),
|
||||||
animate = $.fn.animate;
|
animate = $.fn.animate;
|
||||||
// called twice (both panels)
|
|
||||||
|
// Called twice (both panels)
|
||||||
$.fn.animate = function( props, options ) {
|
$.fn.animate = function( props, options ) {
|
||||||
equal( options.duration, 100, "correct duration" );
|
equal( options.duration, 100, "correct duration" );
|
||||||
equal( options.easing, "linear", "correct easing" );
|
equal( options.easing, "linear", "correct easing" );
|
||||||
@ -196,23 +200,24 @@ asyncTest( "{ animate: { duration, easing } }", function() {
|
|||||||
|
|
||||||
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
ok( panels.eq( 0 ).is( ":visible" ), "first panel visible" );
|
||||||
element.accordion( "option", "active", 1 );
|
element.accordion( "option", "active", 1 );
|
||||||
panels.promise().done(function() {
|
panels.promise().done( function() {
|
||||||
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
ok( panels.eq( 0 ).is( ":hidden" ), "first panel hidden" );
|
||||||
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
ok( panels.eq( 1 ).is( ":visible" ), "second panel visible" );
|
||||||
$.fn.animate = animate;
|
$.fn.animate = animate;
|
||||||
start();
|
start();
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
asyncTest( "{ animate: { duration, easing } }, animate down", function() {
|
asyncTest( "{ animate: { duration, easing } }, animate down", function() {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: 1,
|
active: 1,
|
||||||
animate: { duration: 100, easing: "linear" }
|
animate: { duration: 100, easing: "linear" }
|
||||||
}),
|
} ),
|
||||||
panels = element.find( ".ui-accordion-content" ),
|
panels = element.find( ".ui-accordion-content" ),
|
||||||
animate = $.fn.animate;
|
animate = $.fn.animate;
|
||||||
// called twice (both panels)
|
|
||||||
|
// Called twice (both panels)
|
||||||
$.fn.animate = function( props, options ) {
|
$.fn.animate = function( props, options ) {
|
||||||
equal( options.duration, 100, "correct duration" );
|
equal( options.duration, 100, "correct duration" );
|
||||||
equal( options.easing, "linear", "correct easing" );
|
equal( options.easing, "linear", "correct easing" );
|
||||||
@ -221,17 +226,17 @@ asyncTest( "{ animate: { duration, easing } }, animate down", function() {
|
|||||||
|
|
||||||
ok( panels.eq( 1 ).is( ":visible" ), "first panel visible" );
|
ok( panels.eq( 1 ).is( ":visible" ), "first panel visible" );
|
||||||
element.accordion( "option", "active", 0 );
|
element.accordion( "option", "active", 0 );
|
||||||
panels.promise().done(function() {
|
panels.promise().done( function() {
|
||||||
ok( panels.eq( 1 ).is( ":hidden" ), "first panel hidden" );
|
ok( panels.eq( 1 ).is( ":hidden" ), "first panel hidden" );
|
||||||
ok( panels.eq( 0 ).is( ":visible" ), "second panel visible" );
|
ok( panels.eq( 0 ).is( ":visible" ), "second panel visible" );
|
||||||
$.fn.animate = animate;
|
$.fn.animate = animate;
|
||||||
start();
|
start();
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
asyncTest( "{ animate: { duration, easing, down } }, animate down", function() {
|
asyncTest( "{ animate: { duration, easing, down } }, animate down", function() {
|
||||||
expect( 7 );
|
expect( 7 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: 1,
|
active: 1,
|
||||||
animate: {
|
animate: {
|
||||||
duration: 100,
|
duration: 100,
|
||||||
@ -240,10 +245,11 @@ asyncTest( "{ animate: { duration, easing, down } }, animate down", function() {
|
|||||||
easing: "swing"
|
easing: "swing"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}),
|
} ),
|
||||||
panels = element.find( ".ui-accordion-content" ),
|
panels = element.find( ".ui-accordion-content" ),
|
||||||
animate = $.fn.animate;
|
animate = $.fn.animate;
|
||||||
// called twice (both panels)
|
|
||||||
|
// Called twice (both panels)
|
||||||
$.fn.animate = function( props, options ) {
|
$.fn.animate = function( props, options ) {
|
||||||
equal( options.duration, 100, "correct duration" );
|
equal( options.duration, 100, "correct duration" );
|
||||||
equal( options.easing, "swing", "correct easing" );
|
equal( options.easing, "swing", "correct easing" );
|
||||||
@ -252,19 +258,19 @@ asyncTest( "{ animate: { duration, easing, down } }, animate down", function() {
|
|||||||
|
|
||||||
ok( panels.eq( 1 ).is( ":visible" ), "first panel visible" );
|
ok( panels.eq( 1 ).is( ":visible" ), "first panel visible" );
|
||||||
element.accordion( "option", "active", 0 );
|
element.accordion( "option", "active", 0 );
|
||||||
panels.promise().done(function() {
|
panels.promise().done( function() {
|
||||||
ok( panels.eq( 1 ).is( ":hidden" ), "first panel hidden" );
|
ok( panels.eq( 1 ).is( ":hidden" ), "first panel hidden" );
|
||||||
ok( panels.eq( 0 ).is( ":visible" ), "second panel visible" );
|
ok( panels.eq( 0 ).is( ":visible" ), "second panel visible" );
|
||||||
$.fn.animate = animate;
|
$.fn.animate = animate;
|
||||||
start();
|
start();
|
||||||
});
|
} );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ collapsible: false }", function() {
|
test( "{ collapsible: false }", function() {
|
||||||
expect( 4 );
|
expect( 4 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: 1
|
active: 1
|
||||||
});
|
} );
|
||||||
element.accordion( "option", "active", false );
|
element.accordion( "option", "active", false );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
@ -272,14 +278,14 @@ test( "{ collapsible: false }", function() {
|
|||||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" );
|
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ collapsible: true }", function() {
|
test( "{ collapsible: true }", function() {
|
||||||
expect( 6 );
|
expect( 6 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
active: 1,
|
active: 1,
|
||||||
collapsible: true
|
collapsible: true
|
||||||
});
|
} );
|
||||||
|
|
||||||
element.accordion( "option", "active", false );
|
element.accordion( "option", "active", false );
|
||||||
equal( element.accordion( "option", "active" ), false );
|
equal( element.accordion( "option", "active" ), false );
|
||||||
@ -292,37 +298,37 @@ test( "{ collapsible: true }", function() {
|
|||||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" );
|
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" );
|
||||||
equal( element.accordion( "option", "active" ), false );
|
equal( element.accordion( "option", "active" ), false );
|
||||||
state( element, 0, 0, 0 );
|
state( element, 0, 0, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ event: null }", function() {
|
test( "{ event: null }", function() {
|
||||||
expect( 5 );
|
expect( 5 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
event: null
|
event: null
|
||||||
});
|
} );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
|
|
||||||
element.accordion( "option", "active", 1 );
|
element.accordion( "option", "active", 1 );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
|
|
||||||
// ensure default click handler isn't bound
|
// Ensure default click handler isn't bound
|
||||||
element.find( ".ui-accordion-header" ).eq( 2 ).trigger( "click" );
|
element.find( ".ui-accordion-header" ).eq( 2 ).trigger( "click" );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ event: custom }", function() {
|
test( "{ event: custom }", function() {
|
||||||
expect( 11 );
|
expect( 11 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
event: "custom1 custom2"
|
event: "custom1 custom2"
|
||||||
});
|
} );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
|
|
||||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
|
|
||||||
// ensure default click handler isn't bound
|
// Ensure default click handler isn't bound
|
||||||
element.find( ".ui-accordion-header" ).eq( 2 ).trigger( "click" );
|
element.find( ".ui-accordion-header" ).eq( 2 ).trigger( "click" );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
@ -333,7 +339,7 @@ test( "{ event: custom }", function() {
|
|||||||
|
|
||||||
element.accordion( "option", "event", "custom3" );
|
element.accordion( "option", "event", "custom3" );
|
||||||
|
|
||||||
// ensure old event handlers are unbound
|
// Ensure old event handlers are unbound
|
||||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom1" );
|
||||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom2" );
|
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom2" );
|
||||||
equal( element.accordion( "option", "active" ), 2 );
|
equal( element.accordion( "option", "active" ), 2 );
|
||||||
@ -342,126 +348,128 @@ test( "{ event: custom }", function() {
|
|||||||
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom3" );
|
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "custom3" );
|
||||||
equal( element.accordion( "option", "active" ), 1 );
|
equal( element.accordion( "option", "active" ), 1 );
|
||||||
state( element, 0, 1, 0 );
|
state( element, 0, 1, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ header: default }", function() {
|
test( "{ header: default }", function() {
|
||||||
expect( 2 );
|
expect( 2 );
|
||||||
// default: > li > :first-child,> :not(li):even
|
|
||||||
|
// Default: > li > :first-child,> :not(li):even
|
||||||
// > :not(li):even
|
// > :not(li):even
|
||||||
state( $( "#list1" ).accordion(), 1, 0, 0);
|
state( $( "#list1" ).accordion(), 1, 0, 0 );
|
||||||
|
|
||||||
// > li > :first-child
|
// > li > :first-child
|
||||||
state( $( "#navigation" ).accordion(), 1, 0, 0);
|
state( $( "#navigation" ).accordion(), 1, 0, 0 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ header: custom }", function( assert ) {
|
test( "{ header: custom }", function( assert ) {
|
||||||
expect( 6 );
|
expect( 6 );
|
||||||
var element = $( "#navigationWrapper" ).accordion({
|
var element = $( "#navigationWrapper" ).accordion( {
|
||||||
header: "h2"
|
header: "h2"
|
||||||
});
|
} );
|
||||||
element.find( "h2" ).each(function() {
|
element.find( "h2" ).each( function() {
|
||||||
assert.hasClasses( this, "ui-accordion-header" );
|
assert.hasClasses( this, "ui-accordion-header" );
|
||||||
});
|
} );
|
||||||
equal( element.find( ".ui-accordion-header" ).length, 3 );
|
equal( element.find( ".ui-accordion-header" ).length, 3 );
|
||||||
state( element, 1, 0, 0 );
|
state( element, 1, 0, 0 );
|
||||||
element.accordion( "option", "active", 2 );
|
element.accordion( "option", "active", 2 );
|
||||||
state( element, 0, 0, 1 );
|
state( element, 0, 0, 1 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ heightStyle: 'auto' }", function() {
|
test( "{ heightStyle: 'auto' }", function() {
|
||||||
expect( 3 );
|
expect( 3 );
|
||||||
var element = $( "#navigation" ).accordion({ heightStyle: "auto" });
|
var element = $( "#navigation" ).accordion( { heightStyle: "auto" } );
|
||||||
equalHeight( element, 105 );
|
equalHeight( element, 105 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ heightStyle: 'content' }", function() {
|
test( "{ heightStyle: 'content' }", function() {
|
||||||
expect( 3 );
|
expect( 3 );
|
||||||
var element = $( "#navigation" ).accordion({ heightStyle: "content" }),
|
var element = $( "#navigation" ).accordion( { heightStyle: "content" } ),
|
||||||
sizes = element.find( ".ui-accordion-content" ).map(function() {
|
sizes = element.find( ".ui-accordion-content" ).map( function() {
|
||||||
return $( this ).height();
|
return $( this ).height();
|
||||||
}).get();
|
} ).get();
|
||||||
equal( sizes[ 0 ], 75 );
|
equal( sizes[ 0 ], 75 );
|
||||||
equal( sizes[ 1 ], 105 );
|
equal( sizes[ 1 ], 105 );
|
||||||
equal( sizes[ 2 ], 45 );
|
equal( sizes[ 2 ], 45 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ heightStyle: 'fill' }", function() {
|
test( "{ heightStyle: 'fill' }", function() {
|
||||||
expect( 3 );
|
expect( 3 );
|
||||||
$( "#navigationWrapper" ).height( 500 );
|
$( "#navigationWrapper" ).height( 500 );
|
||||||
var element = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
var element = $( "#navigation" ).accordion( { heightStyle: "fill" } );
|
||||||
equalHeight( element, 455 );
|
equalHeight( element, 455 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ heightStyle: 'fill' } with sibling", function() {
|
test( "{ heightStyle: 'fill' } with sibling", function() {
|
||||||
expect( 3 );
|
expect( 3 );
|
||||||
$( "#navigationWrapper" ).height( 500 );
|
$( "#navigationWrapper" ).height( 500 );
|
||||||
$( "<p>Lorem Ipsum</p>" )
|
$( "<p>Lorem Ipsum</p>" )
|
||||||
.css({
|
.css( {
|
||||||
height: 50,
|
height: 50,
|
||||||
marginTop: 20,
|
marginTop: 20,
|
||||||
marginBottom: 30
|
marginBottom: 30
|
||||||
})
|
} )
|
||||||
.prependTo( "#navigationWrapper" );
|
.prependTo( "#navigationWrapper" );
|
||||||
var element = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
var element = $( "#navigation" ).accordion( { heightStyle: "fill" } );
|
||||||
equalHeight( element , 355 );
|
equalHeight( element, 355 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ heightStyle: 'fill' } with multiple siblings", function() {
|
test( "{ heightStyle: 'fill' } with multiple siblings", function() {
|
||||||
expect( 3 );
|
expect( 3 );
|
||||||
$( "#navigationWrapper" ).height( 500 );
|
$( "#navigationWrapper" ).height( 500 );
|
||||||
$( "<p>Lorem Ipsum</p>" )
|
$( "<p>Lorem Ipsum</p>" )
|
||||||
.css({
|
.css( {
|
||||||
height: 50,
|
height: 50,
|
||||||
marginTop: 20,
|
marginTop: 20,
|
||||||
marginBottom: 30
|
marginBottom: 30
|
||||||
})
|
} )
|
||||||
.prependTo( "#navigationWrapper" );
|
.prependTo( "#navigationWrapper" );
|
||||||
$( "<p>Lorem Ipsum</p>" )
|
$( "<p>Lorem Ipsum</p>" )
|
||||||
.css({
|
.css( {
|
||||||
height: 50,
|
height: 50,
|
||||||
marginTop: 20,
|
marginTop: 20,
|
||||||
marginBottom: 30,
|
marginBottom: 30,
|
||||||
position: "absolute"
|
position: "absolute"
|
||||||
})
|
} )
|
||||||
.prependTo( "#navigationWrapper" );
|
.prependTo( "#navigationWrapper" );
|
||||||
$( "<p>Lorem Ipsum</p>" )
|
$( "<p>Lorem Ipsum</p>" )
|
||||||
.css({
|
.css( {
|
||||||
height: 25,
|
height: 25,
|
||||||
marginTop: 10,
|
marginTop: 10,
|
||||||
marginBottom: 15
|
marginBottom: 15
|
||||||
})
|
} )
|
||||||
.prependTo( "#navigationWrapper" );
|
.prependTo( "#navigationWrapper" );
|
||||||
var element = $( "#navigation" ).accordion({ heightStyle: "fill" });
|
var element = $( "#navigation" ).accordion( { heightStyle: "fill" } );
|
||||||
equalHeight( element, 305 );
|
equalHeight( element, 305 );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ icons: false }", function() {
|
test( "{ icons: false }", function() {
|
||||||
expect( 8 );
|
expect( 8 );
|
||||||
var element = $( "#list1" );
|
var element = $( "#list1" );
|
||||||
function icons( on ) {
|
function icons( on ) {
|
||||||
deepEqual( element.find( "span.ui-icon").length, on ? 3 : 0 );
|
deepEqual( element.find( "span.ui-icon" ).length, on ? 3 : 0 );
|
||||||
deepEqual( element.find( ".ui-accordion-header.ui-accordion-icons" ).length, on ? 3 : 0 );
|
deepEqual( element.find( ".ui-accordion-header.ui-accordion-icons" ).length, on ? 3 : 0 );
|
||||||
}
|
}
|
||||||
element.accordion();
|
element.accordion();
|
||||||
icons( true );
|
icons( true );
|
||||||
element.accordion( "destroy" ).accordion({
|
element.accordion( "destroy" ).accordion( {
|
||||||
icons: false
|
icons: false
|
||||||
});
|
} );
|
||||||
icons( false );
|
icons( false );
|
||||||
element.accordion( "option", "icons", { header: "foo", activeHeader: "bar" } );
|
element.accordion( "option", "icons", { header: "foo", activeHeader: "bar" } );
|
||||||
icons( true );
|
icons( true );
|
||||||
element.accordion( "option", "icons", false );
|
element.accordion( "option", "icons", false );
|
||||||
icons( false );
|
icons( false );
|
||||||
});
|
} );
|
||||||
|
|
||||||
test( "{ icons: hash }", function( assert ) {
|
test( "{ icons: hash }", function( assert ) {
|
||||||
expect( 3 );
|
expect( 3 );
|
||||||
var element = $( "#list1" ).accordion({
|
var element = $( "#list1" ).accordion( {
|
||||||
icons: { activeHeader: "a1", header: "h1" }
|
icons: { activeHeader: "a1", header: "h1" }
|
||||||
});
|
} );
|
||||||
assert.hasClasses( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ), "a1" );
|
assert.hasClasses( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ), "a1" );
|
||||||
element.accordion( "option", "icons", { activeHeader: "a2", header: "h2" } );
|
element.accordion( "option", "icons", { activeHeader: "a2", header: "h2" } );
|
||||||
assert.lacksClasses( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ), "a1");
|
assert.lacksClasses( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ), "a1" );
|
||||||
assert.hasClasses( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ), "a2" );
|
assert.hasClasses( element.find( ".ui-accordion-header.ui-state-active span.ui-icon" ), "a2" );
|
||||||
});
|
} );
|
||||||
|
|
||||||
} );
|
} );
|
||||||
|
@ -53,7 +53,7 @@ return $.widget( "ui.accordion", {
|
|||||||
header: "ui-icon-triangle-1-e"
|
header: "ui-icon-triangle-1-e"
|
||||||
},
|
},
|
||||||
|
|
||||||
// callbacks
|
// Callbacks
|
||||||
activate: null,
|
activate: null,
|
||||||
beforeActivate: null
|
beforeActivate: null
|
||||||
},
|
},
|
||||||
@ -81,7 +81,7 @@ return $.widget( "ui.accordion", {
|
|||||||
this._addClass( "ui-accordion", "ui-widget ui-helper-reset" );
|
this._addClass( "ui-accordion", "ui-widget ui-helper-reset" );
|
||||||
this.element.attr( "role", "tablist" );
|
this.element.attr( "role", "tablist" );
|
||||||
|
|
||||||
// don't allow collapsible: false and active: false / null
|
// Don't allow collapsible: false and active: false / null
|
||||||
if ( !options.collapsible && ( options.active === false || options.active == null ) ) {
|
if ( !options.collapsible && ( options.active === false || options.active == null ) ) {
|
||||||
options.active = 0;
|
options.active = 0;
|
||||||
}
|
}
|
||||||
@ -124,17 +124,17 @@ return $.widget( "ui.accordion", {
|
|||||||
_destroy: function() {
|
_destroy: function() {
|
||||||
var contents;
|
var contents;
|
||||||
|
|
||||||
// clean up main element
|
// Clean up main element
|
||||||
this.element.removeAttr( "role" );
|
this.element.removeAttr( "role" );
|
||||||
|
|
||||||
// clean up headers
|
// Clean up headers
|
||||||
this.headers
|
this.headers
|
||||||
.removeAttr( "role aria-expanded aria-selected aria-controls tabIndex" )
|
.removeAttr( "role aria-expanded aria-selected aria-controls tabIndex" )
|
||||||
.removeUniqueId();
|
.removeUniqueId();
|
||||||
|
|
||||||
this._destroyIcons();
|
this._destroyIcons();
|
||||||
|
|
||||||
// clean up content panels
|
// Clean up content panels
|
||||||
contents = this.headers.next()
|
contents = this.headers.next()
|
||||||
.css( "display", "" )
|
.css( "display", "" )
|
||||||
.removeAttr( "role aria-hidden aria-labelledby" )
|
.removeAttr( "role aria-hidden aria-labelledby" )
|
||||||
@ -161,7 +161,7 @@ return $.widget( "ui.accordion", {
|
|||||||
|
|
||||||
this._super( key, value );
|
this._super( key, value );
|
||||||
|
|
||||||
// setting collapsible: false while collapsed; open first panel
|
// Setting collapsible: false while collapsed; open first panel
|
||||||
if ( key === "collapsible" && !value && this.options.active === false ) {
|
if ( key === "collapsible" && !value && this.options.active === false ) {
|
||||||
this._activate( 0 );
|
this._activate( 0 );
|
||||||
}
|
}
|
||||||
@ -234,7 +234,7 @@ return $.widget( "ui.accordion", {
|
|||||||
var options = this.options;
|
var options = this.options;
|
||||||
this._processPanels();
|
this._processPanels();
|
||||||
|
|
||||||
// was collapsed or no panel
|
// Was collapsed or no panel
|
||||||
if ( ( options.active === false && options.collapsible === true ) || !this.headers.length ) {
|
if ( ( options.active === false && options.collapsible === true ) || !this.headers.length ) {
|
||||||
options.active = false;
|
options.active = false;
|
||||||
this.active = $();
|
this.active = $();
|
||||||
@ -318,7 +318,7 @@ return $.widget( "ui.accordion", {
|
|||||||
} )
|
} )
|
||||||
.hide();
|
.hide();
|
||||||
|
|
||||||
// make sure at least one header is in the tab order
|
// Make sure at least one header is in the tab order
|
||||||
if ( !this.active.length ) {
|
if ( !this.active.length ) {
|
||||||
this.headers.eq( 0 ).attr( "tabIndex", 0 );
|
this.headers.eq( 0 ).attr( "tabIndex", 0 );
|
||||||
} else {
|
} else {
|
||||||
@ -372,12 +372,12 @@ return $.widget( "ui.accordion", {
|
|||||||
_activate: function( index ) {
|
_activate: function( index ) {
|
||||||
var active = this._findActive( index )[ 0 ];
|
var active = this._findActive( index )[ 0 ];
|
||||||
|
|
||||||
// trying to activate the already active panel
|
// Trying to activate the already active panel
|
||||||
if ( active === this.active[ 0 ] ) {
|
if ( active === this.active[ 0 ] ) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// trying to collapse, simulate a click on the currently active header
|
// Trying to collapse, simulate a click on the currently active header
|
||||||
active = active || this.active[ 0 ];
|
active = active || this.active[ 0 ];
|
||||||
|
|
||||||
this._eventHandler( {
|
this._eventHandler( {
|
||||||
@ -436,12 +436,12 @@ return $.widget( "ui.accordion", {
|
|||||||
|
|
||||||
options.active = collapsing ? false : this.headers.index( clicked );
|
options.active = collapsing ? false : this.headers.index( clicked );
|
||||||
|
|
||||||
// when the call to ._toggle() comes after the class changes
|
// When the call to ._toggle() comes after the class changes
|
||||||
// it causes a very odd bug in IE 8 (see #6720)
|
// it causes a very odd bug in IE 8 (see #6720)
|
||||||
this.active = clickedIsActive ? $() : clicked;
|
this.active = clickedIsActive ? $() : clicked;
|
||||||
this._toggle( eventData );
|
this._toggle( eventData );
|
||||||
|
|
||||||
// switch classes
|
// Switch classes
|
||||||
// corner classes on the previously active header stay after the animation
|
// corner classes on the previously active header stay after the animation
|
||||||
this._removeClass( active, "ui-accordion-header-active", "ui-state-active" );
|
this._removeClass( active, "ui-accordion-header-active", "ui-state-active" );
|
||||||
if ( options.icons ) {
|
if ( options.icons ) {
|
||||||
@ -467,7 +467,7 @@ return $.widget( "ui.accordion", {
|
|||||||
var toShow = data.newPanel,
|
var toShow = data.newPanel,
|
||||||
toHide = this.prevShow.length ? this.prevShow : data.oldPanel;
|
toHide = this.prevShow.length ? this.prevShow : data.oldPanel;
|
||||||
|
|
||||||
// handle activating a panel during the animation for another activation
|
// Handle activating a panel during the animation for another activation
|
||||||
this.prevShow.add( this.prevHide ).stop( true, true );
|
this.prevShow.add( this.prevHide ).stop( true, true );
|
||||||
this.prevShow = toShow;
|
this.prevShow = toShow;
|
||||||
this.prevHide = toHide;
|
this.prevHide = toHide;
|
||||||
|
Loading…
Reference in New Issue
Block a user