Dimensions: ignore transforms when retrieving width/height

Close gh-3561
Fixes gh-3193
This commit is contained in:
Timmy Willison 2017-03-06 17:33:47 -05:00
parent fc34dbc271
commit c920ff6e32
No known key found for this signature in database
GPG Key ID: 5F0C8B73EF56CE6F
2 changed files with 28 additions and 31 deletions

View File

@ -128,44 +128,30 @@ function augmentWidthOrHeight( elem, name, extra, isBorderBox, styles ) {
function getWidthOrHeight( elem, name, extra ) {
// Start with offset property, which is equivalent to the border-box value
var val,
valueIsBorderBox = true,
// Start with computed style
var valueIsBorderBox,
styles = getStyles( elem ),
val = curCSS( elem, name, styles ),
isBorderBox = jQuery.css( elem, "boxSizing", false, styles ) === "border-box";
// Support: IE <=11 only
// Running getBoundingClientRect on a disconnected node
// in IE throws an error.
if ( elem.getClientRects().length ) {
val = elem.getBoundingClientRect()[ name ];
// Fall back to uncomputed css if necessary
if ( val < 0 || val == null ) {
val = elem.style[ name ];
}
// Some non-html elements return undefined for offsetWidth, so check for null/undefined
// svg - https://bugzilla.mozilla.org/show_bug.cgi?id=649285
// MathML - https://bugzilla.mozilla.org/show_bug.cgi?id=491668
if ( val <= 0 || val == null ) {
// Fall back to computed then uncomputed css if necessary
val = curCSS( elem, name, styles );
if ( val < 0 || val == null ) {
val = elem.style[ name ];
}
// Computed unit is not pixels. Stop here and return.
if ( rnumnonpx.test( val ) ) {
return val;
}
// Check for style in case a browser which returns unreliable values
// for getComputedStyle silently falls back to the reliable elem.style
valueIsBorderBox = isBorderBox &&
( support.boxSizingReliable() || val === elem.style[ name ] );
// Normalize "", auto, and prepare for extra
val = parseFloat( val ) || 0;
// Computed unit is not pixels. Stop here and return.
if ( rnumnonpx.test( val ) ) {
return val;
}
// Check for style in case a browser which returns unreliable values
// for getComputedStyle silently falls back to the reliable elem.style
valueIsBorderBox = isBorderBox &&
( support.boxSizingReliable() || val === elem.style[ name ] );
// Normalize "", auto, and prepare for extra
val = parseFloat( val ) || 0;
// Use the active box-sizing model to add/subtract irrelevant styles
return ( val +
augmentWidthOrHeight(

View File

@ -527,4 +527,15 @@ QUnit.test( "outside view position (gh-2836)", function( assert ) {
parent.scrollTop( 400 );
} );
QUnit.test( "width/height on element with transform (gh-3193)", function( assert ) {
assert.expect( 2 );
var $elem = jQuery( "<div style='width: 200px; height: 200px; transform: scale(2);' />" )
.appendTo( "#qunit-fixture" );
assert.equal( $elem.width(), 200, "Width ignores transforms" );
assert.equal( $elem.height(), 200, "Height ignores transforms" );
} );
} )();