CSS: Fix reliableTrDimensions support test for initially hidden iframes

Closes gh-5358
Ref gh-5317
Ref gh-5359
This commit is contained in:
Michał Gołębiowski-Owczarek 2023-11-07 00:35:52 +01:00 committed by GitHub
parent f47c6a8337
commit b1e66a5faa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 87 additions and 1 deletions

View File

@ -47,6 +47,12 @@ support.reliableTrDimensions = function() {
.appendChild( tr ) .appendChild( tr )
.appendChild( div ); .appendChild( div );
// Don't run until window is visible
if ( table.offsetWidth === 0 ) {
documentElement.removeChild( table );
return;
}
trStyle = window.getComputedStyle( tr ); trStyle = window.getComputedStyle( tr );
reliableTrDimensionsVal = ( parseInt( trStyle.height, 10 ) + reliableTrDimensionsVal = ( parseInt( trStyle.height, 10 ) +
parseInt( trStyle.borderTopWidth, 10 ) + parseInt( trStyle.borderTopWidth, 10 ) +

View File

@ -0,0 +1,34 @@
<!DOCTYPE html>
<html>
<head>
<title>Test computeStyleTests for hidden iframe</title>
<meta charset="utf-8">
<style>
* {
box-sizing: border-box;
}
#test {
position: absolute;
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();
startIframeTest( initialHeight );
</script>
</body>
</html>

View File

@ -243,7 +243,7 @@ this.ajaxTest = function( title, expect, options, wrapper ) {
} ); } );
}; };
this.testIframe = function( title, fileName, func, wrapper ) { this.testIframe = function( title, fileName, func, wrapper, iframeStyles ) {
if ( !wrapper ) { if ( !wrapper ) {
wrapper = QUnit.test; wrapper = QUnit.test;
} }
@ -253,6 +253,11 @@ this.testIframe = function( title, fileName, func, wrapper ) {
.css( { position: "absolute", top: "0", left: "-600px", width: "500px" } ) .css( { position: "absolute", top: "0", left: "-600px", width: "500px" } )
.attr( { id: "qunit-fixture-iframe", src: url( fileName ) } ); .attr( { id: "qunit-fixture-iframe", src: url( fileName ) } );
// Add other iframe styles
if ( iframeStyles ) {
$iframe.css( iframeStyles );
}
// Test iframes are expected to invoke this via startIframeTest (cf. iframeTest.js) // Test iframes are expected to invoke this via startIframeTest (cf. iframeTest.js)
window.iframeCallback = function() { window.iframeCallback = function() {
var args = Array.prototype.slice.call( arguments ); var args = Array.prototype.slice.call( arguments );

View File

@ -1386,6 +1386,47 @@ testIframe(
} }
); );
( 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" }
);
} )();
QUnit.testUnlessIE( "css('width') and css('height') should return fractional values for nodes in the document", function( assert ) { QUnit.testUnlessIE( "css('width') and css('height') should return fractional values for nodes in the document", function( assert ) {
assert.expect( 2 ); assert.expect( 2 );