From 79bcb291324167ab2d844027d0cdc6300613d010 Mon Sep 17 00:00:00 2001 From: Timmy Willison Date: Fri, 8 May 2015 15:27:54 -0700 Subject: [PATCH] CSS: fix :visible/:hidden selectors for inline element w/ content - Reverts behavior from 10399dd, which we never released. BR and inline elements are considered visible. - The possibility of dropping .offsetWidth and .offsetHeight was debunked by this perf: http://jsperf.com/visible-hidden-and-getclientrects Fixes gh-2227 Close gh-2281 --- src/css/hiddenVisibleSelectors.js | 6 ++---- test/unit/css.js | 20 +++++++++++++------- 2 files changed, 15 insertions(+), 11 deletions(-) diff --git a/src/css/hiddenVisibleSelectors.js b/src/css/hiddenVisibleSelectors.js index 01ecc3396..b4d7482e8 100644 --- a/src/css/hiddenVisibleSelectors.js +++ b/src/css/hiddenVisibleSelectors.js @@ -4,12 +4,10 @@ define([ ], function( jQuery ) { jQuery.expr.filters.hidden = function( elem ) { - // Use OR instead of AND as the element is not visible if either is true - // See tickets #10406 and #13132 - return !elem.offsetWidth || !elem.offsetHeight; + return !jQuery.expr.filters.visible( elem ); }; jQuery.expr.filters.visible = function( elem ) { - return !jQuery.expr.filters.hidden( elem ); + return !!( elem.offsetWidth || elem.offsetHeight || elem.getClientRects().length ); }; }); diff --git a/test/unit/css.js b/test/unit/css.js index b977b067c..a3be0d405 100644 --- a/test/unit/css.js +++ b/test/unit/css.js @@ -924,9 +924,9 @@ test( "css opacity consistency across browsers (#12685)", function() { }); test( ":visible/:hidden selectors", function() { - expect( 16 ); + expect( 18 ); - var $newDiv, $br, $table; + var $div, $br, $table, $a; ok( jQuery("#nothiddendiv").is(":visible"), "Modifying CSS display: Assert element is visible" ); jQuery("#nothiddendiv").css({ display: "none" }); @@ -942,11 +942,14 @@ test( ":visible/:hidden selectors", function() { jQuery("#nothiddendiv").css("display", "block"); ok( jQuery("#nothiddendiv").is(":visible"), "Modified CSS display: Assert element is visible"); - ok( !jQuery("#siblingspan").is(":visible"), "Span with no content not visible (#13132)" ); - $newDiv = jQuery("
").appendTo("#qunit-fixture"); - equal( $newDiv.find(":visible").length, 0, "Span with no content not visible (#13132)" ); - $br = jQuery("
").appendTo("#qunit-fixture"); - ok( !$br.is(":visible"), "br element not visible (#10406)"); + ok( jQuery( "#siblingspan" ).is( ":visible" ), "Span with no content is visible" ); + $div = jQuery( "
" ).appendTo( "#qunit-fixture" ); + equal( $div.find( ":visible" ).length, 1, "Span with no content is visible" ); + $div.css( { width: 0, height: 0, overflow: "hidden" } ); + ok( $div.is( ":visible" ), "Div with width and height of 0 is still visible (gh-2227)" ); + + $br = jQuery( "
" ).appendTo( "#qunit-fixture" ); + ok( $br.is( ":visible" ), "br element is visible" ); $table = jQuery("#table"); $table.html("cellcell"); @@ -957,6 +960,9 @@ test( ":visible/:hidden selectors", function() { t( "Is Visible", "#qunit-fixture div:visible:lt(2)", ["foo", "nothiddendiv"] ); t( "Is Not Hidden", "#qunit-fixture:hidden", [] ); t( "Is Hidden", "#form input:hidden", ["hidden1","hidden2"] ); + + $a = jQuery( "

Header

" ).appendTo( "#qunit-fixture" ); + ok( $a.is( ":visible" ), "Anchor tag with flow content is visible (gh-2227)" ); }); test( "Keep the last style if the new one isn't recognized by the browser (#14836)", function() { -- 2.39.5