Dimensions: Modify reliableTrDimensions support test to account for FF

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
index fb2a1b2045a3b35405459f458f6994edb11aabf8..3ed31bb9b5c8e079b1994b865e44a5c83dd96978 100644 (file)
--- a/src/css/support.js
+++ b/src/css/support.js
@@ -102,6 +102,10 @@ 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 ) {
@@ -109,7 +113,12 @@ define( [
                                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
index 230f047f31fdb53ae31ab8dd8a45004a791daac4..9338af3c3226b4745f7fc7955c0408eb29e8e845 100644 (file)
--- 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
index dde4e41972617082b37ffc65f21063219cf369b6..684a397ec526054c14b03bb3457824c4a4ea5058 100644 (file)
--- 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: {