Button: Sync disabled state upon refresh()

Fixes gh-7139

Author: Gabriel Schulhof

js/widgets/forms/button.js

@@ -126,13 +126,19 @@ $.widget( "mobile.button", {
 	},
 
 	refresh: function( create ) {
+		var originalElement,
+			isDisabled = this.element.prop( "disabled" );
+
 		if ( this.options.icon && this.options.iconpos === "notext" && this.element.attr( "title" ) ) {
 			this.element.attr( "title", this.element.val() );
 		}
 		if ( !create ) {
-			var originalElement = this.element.detach();
+			originalElement = this.element.detach();
 			$( this.wrapper ).text( this.element.val() ).append( originalElement );
 		}
+		if ( this.options.disabled !== isDisabled ) {
+			this._setOptions({ disabled: isDisabled });
+		}
 	}
 });
 

tests/unit/button/button_core.js

@@ -44,4 +44,14 @@
 		ok( $htmlstring.find("sup").length, "HTML contained within a button element should carry over to the enhanced version" );
 	});
 
+	test( "Button's disabled state synced via refresh()", function() {
+		var button = $( "#disabled-state" );
+
+		button.prop( "disabled", true ).button( "refresh" );
+
+		deepEqual( button.parent().hasClass( "ui-state-disabled" ), true,
+			"class ui-state-disabled has been added to the wrapper" );
+		deepEqual( button.button( "option", "disabled" ), true, "option disabled is now true" );
+	});
+
 })( jQuery );

tests/unit/button/index.html

@@ -64,6 +64,7 @@
 			<button id="theme-check-explicit" value="foo" data-nstest-theme="a"></button>
 			<button id="contains-html">Supports <sup>phrasing content</sup></button>
 			<input type="button" id="val-contains-html" value="<fake markup>"/>
+			<input type="button" id="disabled-state" value="ABC"/>
 		</div>
 	</div>
 </body>