CSS: Detect more WebKit styles erroneously reported as percentages

Ref 692f9d4 Fixes gh-3777 Closes gh-3778
jquery · Sep 18, 2017 · 94ddf62 · 94ddf62 · dmethvin · Sep 27, 2017
1 parent 8ea78ca
commit 94ddf62
Show file tree

Hide file tree

Showing 6 changed files with 30 additions and 29 deletions.
diff --git a/src/css.js b/src/css.js
@@ -2,7 +2,6 @@ define( [
 	"./core",
 	"./var/pnum",
 	"./core/access",
-	"./css/var/rmargin",
 	"./var/document",
 	"./var/rcssNum",
 	"./css/var/rnumnonpx",
@@ -17,7 +16,7 @@ define( [
 	"./core/init",
 	"./core/ready",
 	"./selector" // contains
-], function( jQuery, pnum, access, rmargin, document, rcssNum, rnumnonpx, cssExpand,
+], function( jQuery, pnum, access, document, rcssNum, rnumnonpx, cssExpand,
 	getStyles, swap, curCSS, adjustCSS, addGetHookIf, support ) {
 
 "use strict";
@@ -447,7 +446,7 @@ jQuery.each( {
 		}
 	};
 
-	if ( !rmargin.test( prefix ) ) {
+	if ( prefix !== "margin" ) {
 		jQuery.cssHooks[ prefix + suffix ].set = setPositiveNumber;
 	}
 } );

diff --git a/src/css/curCSS.js b/src/css/curCSS.js
@@ -1,11 +1,11 @@
 define( [
 	"../core",
+	"./var/rboxStyle",
 	"./var/rnumnonpx",
-	"./var/rmargin",
 	"./var/getStyles",
 	"./support",
 	"../selector" // Get jQuery.contains
-], function( jQuery, rnumnonpx, rmargin, getStyles, support ) {
+], function( jQuery, rboxStyle, rnumnonpx, getStyles, support ) {
 
 "use strict";
 
@@ -35,7 +35,7 @@ function curCSS( elem, name, computed ) {
 		// but width seems to be reliably pixels.
 		// This is against the CSSOM draft spec:
 		// https://drafts.csswg.org/cssom/#resolved-values
-		if ( !support.pixelMarginRight() && rnumnonpx.test( ret ) && rmargin.test( name ) ) {
+		if ( !support.pixelBoxStyles() && rnumnonpx.test( ret ) && rboxStyle.test( name ) ) {
 
 			// Remember the original values
 			width = style.width;

diff --git a/src/css/support.js b/src/css/support.js
@@ -32,10 +32,10 @@ define( [
 		// Support: Android 4.0 - 4.3 only, Firefox <=3 - 44
 		reliableMarginLeftVal = divStyle.marginLeft === "12px";
 
-		// Support: Android 4.0 - 4.3 only
+		// Support: Android 4.0 - 4.3 only, Safari <=9.1 - 10.1, iOS <=7.0 - 9.3
 		// Some styles come back with percentage values, even though they shouldn't
-		div.style.marginRight = "60%";
-		pixelMarginRightVal = divStyle.marginRight === "36px";
+		div.style.right = "60%";
+		pixelBoxStylesVal = divStyle.right === "36px";
 
 		// Support: IE 9 - 11 only
 		// Detect misreporting of content dimensions for box-sizing:border-box elements
@@ -53,7 +53,7 @@ define( [
 		div = null;
 	}
 
-	var pixelPositionVal, boxSizingReliableVal, scrollboxSizeVal, pixelMarginRightVal,
+	var pixelPositionVal, boxSizingReliableVal, scrollboxSizeVal, pixelBoxStylesVal,
 		reliableMarginLeftVal,
 		container = document.createElement( "div" ),
 		div = document.createElement( "div" );
@@ -74,13 +74,13 @@ define( [
 			computeStyleTests();
 			return boxSizingReliableVal;
 		},
-		pixelPosition: function() {
+		pixelBoxStyles: function() {
 			computeStyleTests();
-			return pixelPositionVal;
+			return pixelBoxStylesVal;
 		},
-		pixelMarginRight: function() {
+		pixelPosition: function() {
 			computeStyleTests();
-			return pixelMarginRightVal;
+			return pixelPositionVal;
 		},
 		reliableMarginLeft: function() {
 			computeStyleTests();

diff --git a/src/css/var/rboxStyle.js b/src/css/var/rboxStyle.js
@@ -0,0 +1,7 @@
+define( [
+	"./cssExpand"
+], function( cssExpand ) {
+	"use strict";
+
+	return new RegExp( cssExpand.join( "|" ), "i" );
+} );
diff --git a/src/css/var/rmargin.js b/src/css/var/rmargin.js
diff --git a/test/unit/support.js b/test/unit/support.js
@@ -70,7 +70,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": true,
 			"pixelPosition": true,
 			"radioValue": true,
 			"reliableMarginLeft": true,
@@ -88,7 +88,7 @@ testIframe(
 			"focusin": true,
 			"noCloneChecked": false,
 			"optSelected": false,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": true,
 			"pixelPosition": true,
 			"radioValue": false,
 			"reliableMarginLeft": true,
@@ -106,7 +106,7 @@ testIframe(
 			"focusin": true,
 			"noCloneChecked": false,
 			"optSelected": false,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": true,
 			"pixelPosition": true,
 			"radioValue": false,
 			"reliableMarginLeft": true,
@@ -127,7 +127,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": true,
 			"pixelPosition": true,
 			"radioValue": true,
 			"reliableMarginLeft": true,
@@ -145,7 +145,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": false,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginLeft": true,
@@ -163,7 +163,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": true,
 			"pixelPosition": true,
 			"radioValue": true,
 			"reliableMarginLeft": false,
@@ -181,7 +181,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": false,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginLeft": true,
@@ -199,7 +199,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": false,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginLeft": true,
@@ -217,7 +217,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": true,
+			"pixelBoxStyles": false,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginLeft": true,
@@ -235,7 +235,7 @@ testIframe(
 			"focusin": false,
 			"noCloneChecked": true,
 			"optSelected": true,
-			"pixelMarginRight": false,
+			"pixelBoxStyles": false,
 			"pixelPosition": false,
 			"radioValue": true,
 			"reliableMarginLeft": false,