CSS: Restore the hack to get pixels for .css('width') etc.

This hack turns out to be needed by Android 4.0-4.3. Add a support test so that the hack is invoked only where needed. Refs gh-1815 Refs gh-1820 Closes gh-1842
jquery · Feb 4, 2015 · 3747cc6 · 3747cc6
1 parent 1ba45fc
commit 3747cc6
Show file tree

Hide file tree

Showing 3 changed files with 49 additions and 4 deletions.
diff --git a/src/css/curCSS.js b/src/css/curCSS.js
@@ -3,11 +3,13 @@ define([
 	"./var/rnumnonpx",
 	"./var/rmargin",
 	"./var/getStyles",
+	"./support",
 	"../selector" // contains
-], function( jQuery, rnumnonpx, rmargin, getStyles ) {
+], function( jQuery, rnumnonpx, rmargin, getStyles, support ) {
 
 function curCSS( elem, name, computed ) {
-	var ret;
+	var width, minWidth, maxWidth, ret,
+		style = elem.style;
 
 	computed = computed || getStyles( elem );
 
@@ -22,6 +24,29 @@ function curCSS( elem, name, computed ) {
 		if ( ret === "" && !jQuery.contains( elem.ownerDocument, elem ) ) {
 			ret = jQuery.style( elem, name );
 		}
+
+		// Support: Android 4.0-4.3
+		// A tribute to the "awesome hack by Dean Edwards"
+		// Android Browser returns percentage for some values,
+		// but width seems to be reliably pixels.
+		// This is against the CSSOM draft spec:
+		// http://dev.w3.org/csswg/cssom/#resolved-values
+		if ( !support.pixelMarginRight() && rnumnonpx.test( ret ) && rmargin.test( name ) ) {
+
+			// Remember the original values
+			width = style.width;
+			minWidth = style.minWidth;
+			maxWidth = style.maxWidth;
+
+			// Put in the new values to get a computed value out
+			style.minWidth = style.maxWidth = style.width = ret;
+			ret = computed.width;
+
+			// Revert the changed values
+			style.width = width;
+			style.minWidth = minWidth;
+			style.maxWidth = maxWidth;
+		}
 	}
 
 	return ret !== undefined ?

diff --git a/src/css/support.js b/src/css/support.js
@@ -6,7 +6,7 @@ define([
 ], function( jQuery, document, documentElement, support ) {
 
 (function() {
-	var pixelPositionVal, boxSizingReliableVal,
+	var pixelPositionVal, boxSizingReliableVal, pixelMarginRightVal,
 		container = document.createElement( "div" ),
 		div = document.createElement( "div" );
 
@@ -20,7 +20,7 @@ define([
 	div.cloneNode( true ).style.backgroundClip = "";
 	support.clearCloneStyle = div.style.backgroundClip === "content-box";
 
-	container.style.cssText = "border:0;width:0;height:0;top:0;left:-9999px;margin-top:1px;" +
+	container.style.cssText = "border:0;width:8px;height:0;top:0;left:-9999px;margin-top:1px;" +
 		"position:absolute";
 	container.appendChild( div );
 
@@ -61,6 +61,16 @@ define([
 				}
 				return boxSizingReliableVal;
 			},
+			pixelMarginRight: function() {
+				if ( pixelMarginRightVal == null ) {
+					div.style.cssText = "display:block;width:50%;margin-right:50%";
+					documentElement.appendChild( container );
+					pixelMarginRightVal =
+						window.getComputedStyle( div, null ).marginRight === "4px";
+					documentElement.removeChild( container );
+				}
+				return pixelMarginRightVal;
+			},
 			reliableMarginRight: function() {
 
 				// Support: Android 2.3

diff --git a/test/unit/support.js b/test/unit/support.js
@@ -66,6 +66,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": true,
 			"optSelected": true,
+			"pixelMarginRight": true,
 			"pixelPosition": true,
 			"radioValue": true,
 			"reliableMarginRight": true
@@ -83,6 +84,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": false,
 			"optDisabled": true,
 			"optSelected": false,
+			"pixelMarginRight": true,
 			"pixelPosition": true,
 			"radioValue": false,
 			"reliableMarginRight": true
@@ -100,6 +102,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": false,
 			"optDisabled": true,
 			"optSelected": false,
+			"pixelMarginRight": true,
 			"pixelPosition": true,
 			"radioValue": false,
 			"reliableMarginRight": true
@@ -117,6 +120,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": true,
 			"optSelected": true,
+			"pixelMarginRight": true,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginRight": true
@@ -134,6 +138,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": true,
 			"optSelected": true,
+			"pixelMarginRight": true,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginRight": true
@@ -151,6 +156,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": true,
 			"optSelected": true,
+			"pixelMarginRight": true,
 			"pixelPosition": true,
 			"radioValue": true,
 			"reliableMarginRight": true
@@ -168,6 +174,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": true,
 			"optSelected": true,
+			"pixelMarginRight": true,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginRight": true
@@ -185,6 +192,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": true,
 			"optSelected": true,
+			"pixelMarginRight": true,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginRight": true
@@ -202,6 +210,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": true,
 			"optSelected": true,
+			"pixelMarginRight": false,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginRight": true
@@ -219,6 +228,7 @@ testIframeWithCallback( "Check CSP (https://developer.mozilla.org/en-US/docs/Sec
 			"noCloneChecked": true,
 			"optDisabled": false,
 			"optSelected": true,
+			"pixelMarginRight": true,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginRight": false