Dimensions: Modify reliableTrDimensions support test to account for FF

timmywil · web-flow · commit bcd40aa7a349 · 2021-01-11T11:56:38.000-05:00
Firefox incorrectly (or perhaps correctly) includes table borders in computed dimensions, but they are the only one. Workaround this by testing for it and falling back to offset properties Fixes gh-4529 Closes gh-4807
diff --git a/src/css/support.js b/src/css/support.js
@@ -102,14 +102,23 @@ define( [
 		// set in CSS while `offset*` properties report correct values.
 		// Behavior in IE 9 is more subtle than in newer versions & it passes
 		// some versions of this test; make sure not to make it pass there!
+		//
+		// Support: Firefox 70+
+		// Only Firefox includes border widths
+		// in computed dimensions. (gh-4529)
 		reliableTrDimensions: function() {
 			var table, tr, trChild, trStyle;
 			if ( reliableTrDimensionsVal == null ) {
 				table = document.createElement( "table" );
 				tr = document.createElement( "tr" );
 				trChild = document.createElement( "div" );
 
-				table.style.cssText = "position:absolute;left:-11111px";
+				table.style.cssText = "position:absolute;left:-11111px;border-collapse:separate";
+				tr.style.cssText = "border:1px solid";
+
+				// Support: Chrome 86+
+				// Height set through cssText does not get applied.
+				// Computed height then comes back as 0.
 				tr.style.height = "1px";
 				trChild.style.height = "9px";
 
@@ -119,7 +128,9 @@ define( [
 					.appendChild( trChild );
 
 				trStyle = window.getComputedStyle( tr );
-				reliableTrDimensionsVal = parseInt( trStyle.height ) > 3;
+				reliableTrDimensionsVal = ( parseInt( trStyle.height, 10 ) +
+					parseInt( trStyle.borderTopWidth, 10 ) +
+					parseInt( trStyle.borderBottomWidth, 10 ) ) === tr.offsetHeight;
 
 				documentElement.removeChild( table );
 			}
diff --git a/test/unit/dimensions.js b/test/unit/dimensions.js
@@ -627,13 +627,7 @@ QUnit.test( "width/height on an inline element with percentage dimensions (gh-36
 	}
 );
 
-// Support: Firefox 70+
-// Firefox 70 & newer fail this test but the issue there is more profound - Firefox doesn't
-// subtract borders from table row computed widths.
-// See https://github.com/jquery/jquery/issues/4529
-// See https://bugzilla.mozilla.org/show_bug.cgi?id=1590837
-// See https://github.com/w3c/csswg-drafts/issues/4444
-QUnit[ /firefox/i.test( navigator.userAgent ) ? "skip" : "test" ](
+QUnit.test(
 	"width/height on a table row with phantom borders (gh-3698)", function( assert ) {
 	assert.expect( 4 );
 
diff --git a/test/unit/support.js b/test/unit/support.js
@@ -188,7 +188,7 @@ testIframe(
 				"pixelPosition": true,
 				"radioValue": true,
 				"reliableMarginLeft": true,
-				"reliableTrDimensions": true,
+				"reliableTrDimensions": false,
 				"scrollboxSize": true
 			},
 			firefox_60: {
