Progressbar: Moved .ui-progressbar-indeterminate to main element. Added tests for markup structure.

This commit is contained in:
Scott González 2012-12-12 11:21:49 -05:00
parent 747d853452
commit f5aaf874e9
3 changed files with 29 additions and 3 deletions

View File

@ -1,5 +1,30 @@
module( "progressbar: core" );
test( "markup structure", function() {
expect( 5 );
var element = $( "#progressbar" ).progressbar();
ok( element.hasClass( "ui-progressbar" ), "main element is .ui-progressbar" );
ok( !element.hasClass( "ui-progressbar-indeterminate" ),
"main element is not .ui-progressbar-indeterminate" );
equal( element.children().length, 1, "main element contains one child" );
ok( element.children().eq( 0 ).hasClass( "ui-progressbar-value" ),
"child is .ui-progressbar-value" );
equal( element.children().children().length, 0, "no overlay div" );
});
test( "markup structure - indeterminate", function() {
expect( 5 );
var element = $( "#progressbar" ).progressbar({ value: false });
ok( element.hasClass( "ui-progressbar" ), "main element is .ui-progressbar" );
ok( element.hasClass( "ui-progressbar-indeterminate" ),
"main element is .ui-progressbar-indeterminate" );
equal( element.children().length, 1, "main element contains one child" );
ok( element.children().eq( 0 ).hasClass( "ui-progressbar-value" ),
"child is .ui-progressbar-value" );
equal( element.children().children( ".ui-progressbar-overlay" ).length, 1,
".ui-progressbar-value has .ui-progressbar-overlay" );
});
test( "accessibility", function() {
expect( 11 );
var element = $( "#progressbar" ).progressbar();

View File

@ -17,12 +17,12 @@
margin: -1px;
height: 100%;
}
.ui-progressbar .ui-progressbar-value .ui-progressbar-overlay {
.ui-progressbar .ui-progressbar-overlay {
background: url("images/animated-overlay.gif");
height: 100%;
filter: alpha(opacity=25);
opacity: 0.25;
}
.ui-progressbar .ui-progressbar-indeterminate {
.ui-progressbar-indeterminate .ui-progressbar-value {
background-image: none;
}

View File

@ -112,9 +112,10 @@ $.widget( "ui.progressbar", {
this.valueDiv
.toggle( this.indeterminate || value > this.min )
.toggleClass( "ui-corner-right", value === this.options.max )
.toggleClass( "ui-progressbar-indeterminate", this.indeterminate )
.width( percentage.toFixed(0) + "%" );
this.element.toggleClass( "ui-progressbar-indeterminate", this.indeterminate );
if ( this.indeterminate ) {
this.element.removeAttr( "aria-valuenow" );
if ( !this.overlayDiv ) {