From 7f21e19bed31482db41dd00c6fabe4e5f71382a9 Mon Sep 17 00:00:00 2001 From: Oleg Gaidarenko Date: Tue, 22 Dec 2015 15:03:44 +0300 Subject: [PATCH] Revert "CSS: Make .css("width") & .css("height") return fractional values" This reverts commit 23212b34e690e857cbc46951dd8c018d181206cb. --- src/css.js | 33 ++++++++------------------- src/css/support.js | 13 +---------- test/.jshintrc | 2 ++ test/unit/css.js | 50 ++--------------------------------------- test/unit/dimensions.js | 40 +++++++++++++-------------------- test/unit/support.js | 12 ---------- 6 files changed, 30 insertions(+), 120 deletions(-) diff --git a/src/css.js b/src/css.js index 30d6b75d1..66e4d52d3 100644 --- a/src/css.js +++ b/src/css.js @@ -123,30 +123,22 @@ 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, + var valueIsBorderBox = true, + val = name === "width" ? elem.offsetWidth : elem.offsetHeight, styles = getStyles( elem ), isBorderBox = jQuery.css( elem, "boxSizing", false, styles ) === "border-box"; - if ( support.gBCRDimensions() ) { + // Support: IE11 only + // In IE 11 fullscreen elements inside of an iframe have + // 100x too small dimensions (gh-1764). + if ( document.msFullscreenElement && window.top !== window ) { - // Support: IE <= 11 only + // Support: IE11 only // Running getBoundingClientRect on a disconnected node // in IE throws an error. if ( elem.getClientRects().length ) { - val = elem.getBoundingClientRect()[ name ]; + val = Math.round( elem.getBoundingClientRect()[ name ] * 100 ); } - } else { - - // In IE8 gBCR doesn't report width & height; we need to fall back to offset*. - val = name === "width" ? elem.offsetWidth : elem.offsetHeight; - } - - // Support: IE11 only - // In IE 11 fullscreen elements inside of an iframe have - // 100x too small dimensions (gh-1764). - if ( document.msFullscreenElement && window.top !== window ) { - val *= 100; } // some non-html elements return undefined for offsetWidth, so check for null/undefined @@ -345,14 +337,7 @@ jQuery.each( [ "height", "width" ], function( i, name ) { // certain elements can have dimension info if we invisibly show them // however, it must have a current display style that would benefit from this return rdisplayswap.test( jQuery.css( elem, "display" ) ) && - - // Support: Safari 8+ - // Table columns in Safari have non-zero offsetWidth & zero - // getBoundingClientRect().width unless display is changed. - // Support: IE <= 11 only - // Running getBoundingClientRect on a disconnected node - // in IE throws an error. - ( !elem.getClientRects().length || !elem.getBoundingClientRect().width ) ? + elem.offsetWidth === 0 ? swap( elem, cssShow, function() { return getWidthOrHeight( elem, name, extra ); } ) : diff --git a/src/css/support.js b/src/css/support.js index 549cfa680..be39dabb9 100644 --- a/src/css/support.js +++ b/src/css/support.js @@ -6,7 +6,7 @@ define( [ ], function( jQuery, document, documentElement, support ) { ( function() { - var pixelPositionVal, pixelMarginRightVal, gBCRDimensionsVal, boxSizingReliableVal, + var pixelPositionVal, pixelMarginRightVal, boxSizingReliableVal, reliableHiddenOffsetsVal, reliableMarginRightVal, reliableMarginLeftVal, container = document.createElement( "div" ), div = document.createElement( "div" ); @@ -54,13 +54,6 @@ define( [ return boxSizingReliableVal; }, - gBCRDimensions: function() { - if ( pixelPositionVal == null ) { - computeStyleTests(); - } - return gBCRDimensionsVal; - }, - pixelMarginRight: function() { // Support: Android 4.0-4.3 @@ -117,10 +110,6 @@ define( [ pixelPositionVal = boxSizingReliableVal = reliableMarginLeftVal = false; pixelMarginRightVal = reliableMarginRightVal = true; - // Support: IE<9 - // In IE8 gBCR doesn't report width & height. - gBCRDimensionsVal = !!div.getBoundingClientRect().width; - // Check for getComputedStyle so that this code is not run in IE<9. if ( window.getComputedStyle ) { divStyle = window.getComputedStyle( div ); diff --git a/test/.jshintrc b/test/.jshintrc index a5b3c6fee..13e9ff62c 100644 --- a/test/.jshintrc +++ b/test/.jshintrc @@ -37,6 +37,8 @@ "url": false, "t": false, "q": false, + "equal": true, + "expect": true, "jQuery": true, "sinon": true, diff --git a/test/unit/css.js b/test/unit/css.js index 63a49f848..7943b6717 100644 --- a/test/unit/css.js +++ b/test/unit/css.js @@ -926,54 +926,8 @@ testIframeWithCallback( } ); -( function() { - var supportsFractionalGBCR, - qunitFixture = document.getElementById( "qunit-fixture" ), - div = document.createElement( "div" ); - div.style.width = "3.3px"; - qunitFixture.appendChild( div ); - supportsFractionalGBCR = jQuery.support.gBCRDimensions() && - div.getBoundingClientRect().width.toFixed( 1 ) === "3.3"; - qunitFixture.removeChild( div ); - - QUnit.test( "css('width') and css('height') should return fractional values for nodes in the document", function( assert ) { - if ( !supportsFractionalGBCR ) { - assert.expect( 1 ); - assert.ok( true, "This browser doesn't support fractional values in getBoundingClientRect()" ); - return; - } - - assert.expect( 2 ); - - var el = jQuery( "
" ).appendTo( "#qunit-fixture" ); - jQuery( "" ).appendTo( "#qunit-fixture" ); - - assert.equal( Number( el.css( "width" ).replace( /px$/, "" ) ).toFixed( 1 ), "33.3", - "css('width') should return fractional values" ); - assert.equal( Number( el.css( "height" ).replace( /px$/, "" ) ).toFixed( 1 ), "88.8", - "css('height') should return fractional values" ); - } ); - - QUnit.test( "css('width') and css('height') should return fractional values for disconnected nodes", function( assert ) { - if ( !supportsFractionalGBCR ) { - assert.expect( 1 ); - assert.ok( true, "This browser doesn't support fractional values in getBoundingClientRect()" ); - return; - } - - assert.expect( 2 ); - - var el = jQuery( "
" ); - - assert.equal( Number( el.css( "width" ).replace( /px$/, "" ) ).toFixed( 1 ), "33.3", - "css('width') should return fractional values" ); - assert.equal( Number( el.css( "height" ).replace( /px$/, "" ) ).toFixed( 1 ), "88.8", - "css('height') should return fractional values" ); - } ); -} )(); - -QUnit.test( "certain css values of 'normal' should be convertable to a number, see #8627", function( assert ) { - assert.expect( 3 ); +QUnit.test("certain css values of 'normal' should be convertable to a number, see #8627", function( assert ) { + expect ( 3 ); var el = jQuery( "
test
" ).appendTo( "#qunit-fixture" ); diff --git a/test/unit/dimensions.js b/test/unit/dimensions.js index ef93aa7a3..8a4f0d431 100644 --- a/test/unit/dimensions.js +++ b/test/unit/dimensions.js @@ -258,12 +258,10 @@ QUnit.test( "child of a hidden elem (or unconnected node) has accurate inner/out assert.equal( $divChild.outerWidth(), $divNormal.outerWidth(), "child of a hidden element outerWidth() is wrong see #9441" ); assert.equal( $divChild.outerWidth( true ), $divNormal.outerWidth( true ), "child of a hidden element outerWidth( true ) is wrong see #9300" ); - // Support: IE 10-11, Edge - // Child height is not always decimal - assert.equal( $divChild.height().toFixed( 3 ), $divNormal.height().toFixed( 3 ), "child of a hidden element height() is wrong see #9441" ); - assert.equal( $divChild.innerHeight().toFixed( 3 ), $divNormal.innerHeight().toFixed( 3 ), "child of a hidden element innerHeight() is wrong see #9441" ); - assert.equal( $divChild.outerHeight().toFixed( 3 ), $divNormal.outerHeight().toFixed( 3 ), "child of a hidden element outerHeight() is wrong see #9441" ); - assert.equal( $divChild.outerHeight( true ).toFixed( 3 ), $divNormal.outerHeight( true ).toFixed( 3 ), "child of a hidden element outerHeight( true ) is wrong see #9300" ); + equal( $divChild.height(), $divNormal.height(), "child of a hidden element height() is wrong see #9441" ); + equal( $divChild.innerHeight(), $divNormal.innerHeight(), "child of a hidden element innerHeight() is wrong see #9441" ); + equal( $divChild.outerHeight(), $divNormal.outerHeight(), "child of a hidden element outerHeight() is wrong see #9441" ); + equal( $divChild.outerHeight(true), $divNormal.outerHeight( true ), "child of a hidden element outerHeight( true ) is wrong see #9300" ); // tests that child div of an unconnected div works the same as a normal div assert.equal( $divUnconnected.width(), $divNormal.width(), "unconnected element width() is wrong see #9441" ); @@ -271,12 +269,10 @@ QUnit.test( "child of a hidden elem (or unconnected node) has accurate inner/out assert.equal( $divUnconnected.outerWidth(), $divNormal.outerWidth(), "unconnected element outerWidth() is wrong see #9441" ); assert.equal( $divUnconnected.outerWidth( true ), $divNormal.outerWidth( true ), "unconnected element outerWidth( true ) is wrong see #9300" ); - // Support: IE 10-11, Edge - // Child height is not always decimal - assert.equal( $divUnconnected.height().toFixed( 3 ), $divNormal.height().toFixed( 3 ), "unconnected element height() is wrong see #9441" ); - assert.equal( $divUnconnected.innerHeight().toFixed( 3 ), $divNormal.innerHeight().toFixed( 3 ), "unconnected element innerHeight() is wrong see #9441" ); - assert.equal( $divUnconnected.outerHeight().toFixed( 3 ), $divNormal.outerHeight().toFixed( 3 ), "unconnected element outerHeight() is wrong see #9441" ); - assert.equal( $divUnconnected.outerHeight( true ).toFixed( 3 ), $divNormal.outerHeight( true ).toFixed( 3 ), "unconnected element outerHeight( true ) is wrong see #9300" ); + equal( $divUnconnected.height(), $divNormal.height(), "unconnected element height() is wrong see #9441" ); + equal( $divUnconnected.innerHeight(), $divNormal.innerHeight(), "unconnected element innerHeight() is wrong see #9441" ); + equal( $divUnconnected.outerHeight(), $divNormal.outerHeight(), "unconnected element outerHeight() is wrong see #9441" ); + equal( $divUnconnected.outerHeight(true), $divNormal.outerHeight( true ), "unconnected element outerHeight( true ) is wrong see #9300" ); // teardown html $divHiddenParent.remove(); @@ -335,12 +331,10 @@ QUnit.test( "box-sizing:border-box child of a hidden elem (or unconnected node) assert.equal( $divChild.outerWidth(), $divNormal.outerWidth(), "child of a hidden element outerWidth() is wrong see #10413" ); assert.equal( $divChild.outerWidth( true ), $divNormal.outerWidth( true ), "child of a hidden element outerWidth( true ) is wrong see #10413" ); - // Support: IE 10-11, Edge - // Child height is not always decimal - assert.equal( $divChild.height().toFixed( 3 ), $divNormal.height().toFixed( 3 ), "child of a hidden element height() is wrong see #10413" ); - assert.equal( $divChild.innerHeight().toFixed( 3 ), $divNormal.innerHeight().toFixed( 3 ), "child of a hidden element innerHeight() is wrong see #10413" ); - assert.equal( $divChild.outerHeight().toFixed( 3 ), $divNormal.outerHeight().toFixed( 3 ), "child of a hidden element outerHeight() is wrong see #10413" ); - assert.equal( $divChild.outerHeight( true ).toFixed( 3 ), $divNormal.outerHeight( true ).toFixed( 3 ), "child of a hidden element outerHeight( true ) is wrong see #10413" ); + equal( $divChild.height(), $divNormal.height(), "child of a hidden element height() is wrong see #10413" ); + equal( $divChild.innerHeight(), $divNormal.innerHeight(), "child of a hidden element innerHeight() is wrong see #10413" ); + equal( $divChild.outerHeight(), $divNormal.outerHeight(), "child of a hidden element outerHeight() is wrong see #10413" ); + equal( $divChild.outerHeight(true), $divNormal.outerHeight( true ), "child of a hidden element outerHeight( true ) is wrong see #10413" ); // tests that child div of an unconnected div works the same as a normal div assert.equal( $divUnconnected.width(), $divNormal.width(), "unconnected element width() is wrong see #10413" ); @@ -348,12 +342,10 @@ QUnit.test( "box-sizing:border-box child of a hidden elem (or unconnected node) assert.equal( $divUnconnected.outerWidth(), $divNormal.outerWidth(), "unconnected element outerWidth() is wrong see #10413" ); assert.equal( $divUnconnected.outerWidth( true ), $divNormal.outerWidth( true ), "unconnected element outerWidth( true ) is wrong see #10413" ); - // Support: IE 10-11, Edge - // Child height is not always decimal - assert.equal( $divUnconnected.height().toFixed( 3 ), $divNormal.height().toFixed( 3 ), "unconnected element height() is wrong see #10413" ); - assert.equal( $divUnconnected.innerHeight().toFixed( 3 ), $divNormal.innerHeight().toFixed( 3 ), "unconnected element innerHeight() is wrong see #10413" ); - assert.equal( $divUnconnected.outerHeight().toFixed( 3 ), $divNormal.outerHeight().toFixed( 3 ), "unconnected element outerHeight() is wrong see #10413" ); - assert.equal( $divUnconnected.outerHeight( true ).toFixed( 3 ), $divNormal.outerHeight( true ).toFixed( 3 ), "unconnected element outerHeight( true ) is wrong see #10413" ); + equal( $divUnconnected.height(), $divNormal.height(), "unconnected element height() is wrong see #10413" ); + equal( $divUnconnected.innerHeight(), $divNormal.innerHeight(), "unconnected element innerHeight() is wrong see #10413" ); + equal( $divUnconnected.outerHeight(), $divNormal.outerHeight(), "unconnected element outerHeight() is wrong see #10413" ); + equal( $divUnconnected.outerHeight(true), $divNormal.outerHeight( true ), "unconnected element outerHeight( true ) is wrong see #10413" ); // teardown html $divHiddenParent.remove(); diff --git a/test/unit/support.js b/test/unit/support.js index 4cac9d96d..7644ced86 100644 --- a/test/unit/support.js +++ b/test/unit/support.js @@ -90,7 +90,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -124,7 +123,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": true, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -158,7 +156,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": true, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -192,7 +189,6 @@ testIframeWithCallback( "cssFloat": false, "deleteExpando": false, "focusin": true, - "gBCRDimensions": false, "html5Clone": false, "htmlSerialize": false, "input": false, @@ -229,7 +225,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -263,7 +258,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -297,7 +291,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -331,7 +324,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -399,7 +391,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -433,7 +424,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -467,7 +457,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, @@ -501,7 +490,6 @@ testIframeWithCallback( "cssFloat": true, "deleteExpando": true, "focusin": false, - "gBCRDimensions": true, "html5Clone": true, "htmlSerialize": true, "input": true, -- 2.39.5