library-mirrors/jquery
1
0
Fork 0
mirror of https://github.com/jquery/jquery.git synced 2025-01-10 18:24:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

CSS: Fix reliableTrDimensions test for initially hidden iframes (3.x)

Browse Source 
Also, account for the fact old Firefox (<61) has `null` computed style
for elements in such iframes.

Closes gh-5359
Ref gh-5317
Ref gh-5358
This commit is contained in:
Michał Gołębiowski-Owczarek 2023-11-07 00:35:56 +01:00 committed by GitHub
parent ac68b21fa0
commit 4e98980523
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 63 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/css.js
View File

@ -153,6 +153,9 @@ function getWidthOrHeight( elem, dimension, extra ) {
// IE/Edge misreport `getComputedStyle` of table rows with width/height
// set in CSS while `offset*` properties report correct values.
// Interestingly, in some cases IE 9 doesn't suffer from this issue.
// Support: Firefox 70+
// Firefox includes border widths
// in computed dimensions for table rows. (gh-4529)
!support.reliableTrDimensions() && nodeName( elem, "tr" ) ||
// Fall back to offsetWidth/offsetHeight when value is "auto"

11
src/css/support.js
View File

@ -27,7 +27,10 @@ define( [
documentElement.appendChild( container ).appendChild( div );
var divStyle = window.getComputedStyle( div );
pixelPositionVal = divStyle.top !== "1%";
// Support: Firefox <=48 - 61 only
// Inside hidden iframes computed style is null in old Firefox.
pixelPositionVal = divStyle && divStyle.top !== "1%";
// Don't run until window is visible (https://github.com/jquery/jquery-ui/issues/2176)
if ( div.offsetWidth === 0 ) {
@ -141,6 +144,12 @@ define( [
.appendChild( tr )
.appendChild( trChild );
// Don't run until window is visible
if ( table.offsetWidth === 0 ) {
documentElement.removeChild( table );
return;
}
trStyle = window.getComputedStyle( tr );
reliableTrDimensionsVal = ( parseInt( trStyle.height, 10 ) +
parseInt( trStyle.borderTopWidth, 10 ) +

11
test/data/css/cssComputeStyleTests.html
View File

@ -1,6 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<title>Test computeStyleTests for hidden iframe</title>
<meta charset="utf-8">
<style>
* {
@ -11,14 +12,22 @@
border: 10px solid black;
width: 400px;
}
#test-table {
position: absolute;
width: 100.7px;
border-spacing: 0;
}
</style>
</head>
<body>
<div id="test"></div>
<table id="test-table">
<tr id="test-tr"></tr>
</table>
<script src="../../jquery.js"></script>
<script src="../iframeTest.js"></script>
<script>
var initialHeight = $('#test').outerHeight();
var initialHeight = $( "#test" ).outerHeight();
startIframeTest( initialHeight );
</script>
</body>

54
test/unit/css.js
View File

@ -1401,20 +1401,46 @@ testIframe(
}
);
testIframe(
"Test computeStyleTests for hidden iframe",
"css/cssComputeStyleTests.html",
function( assert, jQuery, window, document, initialHeight ) {
assert.expect( 2 );
assert.strictEqual( initialHeight === 0 ? 20 : initialHeight, 20,
"hidden-frame content sizes should be zero or accurate" );
window.parent.jQuery( "#qunit-fixture-iframe" ).css( { "display": "block" } );
jQuery( "#test" ).width( 600 );
assert.strictEqual( jQuery( "#test" ).width(), 600, "width should be 600" );
},
undefined,
{ "display": "none" }
);
( function() {
var supportsFractionalTrWidth,
epsilon = 0.1,
table = jQuery( "<table><tr></tr></table>" ),
tr = table.find( "tr" );
table
.appendTo( "#qunit-fixture" )
.css( {
width: "100.7px",
borderSpacing: 0
} );
supportsFractionalTrWidth = Math.abs( tr.width() - 100.7 ) < epsilon;
testIframe(
"Test computeStyleTests for hidden iframe",
"css/cssComputeStyleTests.html",
function( assert, jQuery, window, document, initialHeight ) {
assert.expect( 3 );
assert.strictEqual( initialHeight === 0 ? 20 : initialHeight, 20,
"hidden-frame content sizes should be zero or accurate" );
window.parent.jQuery( "#qunit-fixture-iframe" ).css( { "display": "block" } );
jQuery( "#test" ).width( 600 );
assert.strictEqual( jQuery( "#test" ).width(), 600, "width should be 600" );
if ( supportsFractionalTrWidth ) {
assert.ok(
Math.abs( jQuery( "#test-tr" ).width() - 100.7 ) < epsilon,
"tr width should be fractional" );
} else {
assert.strictEqual( jQuery( "#test-tr" ).width(), 101, "tr width as expected" );
}
},
undefined,
{ "display": "none" }
);
} )();
( function() {
var supportsFractionalGBCR,