Permalink
Browse files

CSS: elements are hidden when either offsetWidth or offsetHeight is zero

- Note: this is a breaking change that has been delayed for several versions.

Fixes #10406
Fixes #13132
  • Loading branch information...
timmywil committed Jul 17, 2014
1 parent 269a27c commit 10399ddcf8a239acc27bdec9231b996b178224d3
Showing with 15 additions and 11 deletions.
  1. +3 −1 src/css/hiddenVisibleSelectors.js
  2. +12 −10 test/unit/css.js
@@ -6,7 +6,9 @@ define([
jQuery.expr.filters.hidden = function( elem ) {
// Support: Opera <= 12.12
// Opera reports offsetWidths and offsetHeights less than zero on some elements
- return elem.offsetWidth <= 0 && elem.offsetHeight <= 0;
+ // Use OR instead of AND as the element is not visible if either is true
+ // See tickets #10406 and #13132
+ return elem.offsetWidth <= 0 || elem.offsetHeight <= 0;
};
jQuery.expr.filters.visible = function( elem ) {
return !jQuery.expr.filters.hidden( elem );
View
@@ -886,29 +886,31 @@ test( "css opacity consistency across browsers (#12685)", function() {
});
test( ":visible/:hidden selectors", function() {
- expect( 13 );
+ expect( 16 );
+
+ var $newDiv, $br, $table;
ok( jQuery("#nothiddendiv").is(":visible"), "Modifying CSS display: Assert element is visible" );
jQuery("#nothiddendiv").css({ display: "none" });
ok( !jQuery("#nothiddendiv").is(":visible"), "Modified CSS display: Assert element is hidden" );
- jQuery("#nothiddendiv").css({"display": "block"});
+ jQuery("#nothiddendiv").css({ "display": "block" });
ok( jQuery("#nothiddendiv").is(":visible"), "Modified CSS display: Assert element is visible");
- ok( jQuery(window).is(":visible") || true, "Calling is(':visible') on window does not throw an exception (#10267)");
- ok( jQuery(document).is(":visible") || true, "Calling is(':visible') on document does not throw an exception (#10267)");
+ ok( !jQuery(window).is(":visible"), "Calling is(':visible') on window does not throw an exception (#10267).");
+ ok( !jQuery(document).is(":visible"), "Calling is(':visible') on document does not throw an exception (#10267).");
ok( jQuery("#nothiddendiv").is(":visible"), "Modifying CSS display: Assert element is visible");
jQuery("#nothiddendiv").css("display", "none");
ok( !jQuery("#nothiddendiv").is(":visible"), "Modified CSS display: Assert element is hidden");
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)" );
- // var $newDiv = jQuery("<div><span></span></div>").appendTo("#qunit-fixture");
- // equal( $newDiv.find(":visible").length, 0, "Span with no content not visible (#13132)" );
- // var $br = jQuery("<br/>").appendTo("#qunit-fixture");
- // ok( !$br.is(":visible"), "br element not visible (#10406)");
+ ok( !jQuery("#siblingspan").is(":visible"), "Span with no content not visible (#13132)" );
+ $newDiv = jQuery("<div><span></span></div>").appendTo("#qunit-fixture");
+ equal( $newDiv.find(":visible").length, 0, "Span with no content not visible (#13132)" );
+ $br = jQuery("<br/>").appendTo("#qunit-fixture");
+ ok( !$br.is(":visible"), "br element not visible (#10406)");
- var $table = jQuery("#table");
+ $table = jQuery("#table");
$table.html("<tr><td style='display:none'>cell</td><td>cell</td></tr>");
equal(jQuery("#table td:visible").length, 1, "hidden cell is not perceived as visible (#4512). Works on table elements");
$table.css("display", "none").html("<tr><td>cell</td><td>cell</td></tr>");

1 comment on commit 10399dd

@mgol

This comment has been minimized.

Show comment
Hide comment
@mgol

mgol Jul 19, 2014

Member

@timmywil This seems to break effects tests: http://swarm.jquery.org/job/3295

Member

mgol commented on 10399dd Jul 19, 2014

@timmywil This seems to break effects tests: http://swarm.jquery.org/job/3295

Please sign in to comment.