diff options
| -rw-r--r-- | src/css/support.js | 6 | ||||
| -rw-r--r-- | test/data/css/cssComputeStyleTests.html | 34 | ||||
| -rw-r--r-- | test/data/testinit.js | 7 | ||||
| -rw-r--r-- | test/unit/css.js | 41 |
4 files changed, 87 insertions, 1 deletions
diff --git a/src/css/support.js b/src/css/support.js index 5f9b37d7f..c7229e93a 100644 --- a/src/css/support.js +++ b/src/css/support.js @@ -47,6 +47,12 @@ support.reliableTrDimensions = function() { .appendChild( tr ) .appendChild( div ); + // 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 ) + diff --git a/test/data/css/cssComputeStyleTests.html b/test/data/css/cssComputeStyleTests.html new file mode 100644 index 000000000..9010d70fd --- /dev/null +++ b/test/data/css/cssComputeStyleTests.html @@ -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> diff --git a/test/data/testinit.js b/test/data/testinit.js index aafe2902c..23cea8a40 100644 --- a/test/data/testinit.js +++ b/test/data/testinit.js @@ -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 ) { wrapper = QUnit.test; } @@ -253,6 +253,11 @@ this.testIframe = function( title, fileName, func, wrapper ) { .css( { position: "absolute", top: "0", left: "-600px", width: "500px" } ) .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) window.iframeCallback = function() { var args = Array.prototype.slice.call( arguments ); diff --git a/test/unit/css.js b/test/unit/css.js index 146dcd9da..5567b7437 100644 --- a/test/unit/css.js +++ b/test/unit/css.js @@ -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 ) { assert.expect( 2 ); |