Progressbar: Moved .ui-progressbar-indeterminate to main element. Add…

…ed tests for markup structure.
jquery · Dec 12, 2012 · f5aaf87 · f5aaf87
1 parent 747d853
commit f5aaf87
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 3 deletions.
diff --git a/tests/unit/progressbar/progressbar_core.js b/tests/unit/progressbar/progressbar_core.js
@@ -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();

diff --git a/themes/base/jquery.ui.progressbar.css b/themes/base/jquery.ui.progressbar.css
@@ -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;
 }
diff --git a/ui/jquery.ui.progressbar.js b/ui/jquery.ui.progressbar.js
@@ -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 ) {