library-mirrors/jquery
1
0
Fork 0
mirror of https://github.com/jquery/jquery.git synced 2025-01-10 18:24:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Treat elements as hidden when either offsetWidth OR offsetHeight is 0. Fixes #13132, #10406.

Browse Source
This commit is contained in:
Timmy Willison 2013-01-21 17:06:47 -05:00
parent b83081ba64
commit 3015ee0b5a
2 changed files with 43 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/css.js
View File

@ -630,7 +630,7 @@ jQuery(function() {
if ( jQuery.expr && jQuery.expr.filters ) { if ( jQuery.expr && jQuery.expr.filters ) {
jQuery.expr.filters.hidden = function( elem ) { jQuery.expr.filters.hidden = function( elem ) {
return ( elem.offsetWidth === 0 && elem.offsetHeight === 0 ) || (!jQuery.support.reliableHiddenOffsets && ((elem.style && elem.style.display) || jQuery.css( elem, "display" )) === "none"); return elem.offsetWidth === 0 || elem.offsetHeight === 0 || (!jQuery.support.reliableHiddenOffsets && ((elem.style && elem.style.display) || jQuery.css( elem, "display" )) === "none");
}; };
jQuery.expr.filters.visible = function( elem ) { jQuery.expr.filters.visible = function( elem ) {

81
test/unit/css.js
View File

@ -3,22 +3,14 @@ if ( jQuery.css ) {
module("css", { teardown: moduleTeardown }); module("css", { teardown: moduleTeardown });
test("css(String|Hash)", function() { test("css(String|Hash)", function() {
expect( 46 ); expect( 41 );
equal( jQuery("#qunit-fixture").css("display"), "block", "Check for css property \"display\"" ); equal( jQuery("#qunit-fixture").css("display"), "block", "Check for css property \"display\"" );
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" );
var $child = jQuery("#nothiddendivchild").css({ "width": "20%", "height": "20%" }); var $child = jQuery("#nothiddendivchild").css({ "width": "20%", "height": "20%" });
notEqual( $child.css("width"), "20px", "Retrieving a width percentage on the child of a hidden div returns percentage" ); notEqual( $child.css("width"), "20px", "Retrieving a width percentage on the child of a hidden div returns percentage" );
notEqual( $child.css("height"), "20px", "Retrieving a height percentage on the child of a hidden div returns percentage" ); notEqual( $child.css("height"), "20px", "Retrieving a height percentage on the child of a hidden div returns percentage" );
jQuery("#nothiddendiv").css({"display": "block"});
ok( jQuery("#nothiddendiv").is(":visible"), "Modified CSS display: Assert element is visible");
ok( jQuery(window).is(":visible"), "Calling is(':visible') on window does not throw an error in IE.");
ok( jQuery(document).is(":visible"), "Calling is(':visible') on document does not throw an error in IE.");
var div = jQuery( "<div>" ); var div = jQuery( "<div>" );
// These should be "auto" (or some better value) // These should be "auto" (or some better value)
@ -206,13 +198,7 @@ test("css() explicit and relative values", function() {
}); });
test("css(String, Object)", function() { test("css(String, Object)", function() {
expect(22); expect( 19 );
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");
jQuery("#nothiddendiv").css("top", "-1em"); jQuery("#nothiddendiv").css("top", "-1em");
ok( jQuery("#nothiddendiv").css("top"), -16, "Check negative number in EMs." ); ok( jQuery("#nothiddendiv").css("top"), -16, "Check negative number in EMs." );
@ -678,19 +664,6 @@ test("jQuery.css(elem, 'height') doesn't clear radio buttons (bug #1095)", funct
ok( ! jQuery(":checkbox:last", $checkedtest).attr("checked"), "Check last checkbox still NOT checked." ); ok( ! jQuery(":checkbox:last", $checkedtest).attr("checked"), "Check last checkbox still NOT checked." );
}); });
test(":visible selector works properly on table elements (bug #4512)", function () {
expect(1);
jQuery("#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");
});
test(":visible selector works properly on children with a hidden parent (bug #4512)", function () {
expect(1);
jQuery("#table").css("display", "none").html("<tr><td>cell</td><td>cell</td></tr>");
equal(jQuery("#table td:visible").length, 0, "hidden cell children not perceived as visible");
});
test("internal ref to elem.runtimeStyle (bug #7608)", function () { test("internal ref to elem.runtimeStyle (bug #7608)", function () {
expect(1); expect(1);
var result = true; var result = true;
@ -910,17 +883,47 @@ test( "cssHooks - expand", function() {
test( "css opacity consistency across browsers (#12685)", function() { test( "css opacity consistency across browsers (#12685)", function() {
expect( 4 ); expect( 4 );
var fixture = jQuery("#qunit-fixture"), var fixture = jQuery("#qunit-fixture"),
style = jQuery("<style>.opacityWithSpaces_t12685 { opacity: 0.1; filter: alpha(opacity = 10); } .opacityNoSpaces_t12685 { opacity: 0.2; filter: alpha(opacity=20); }</style>").appendTo(fixture), style = jQuery("<style>.opacityWithSpaces_t12685 { opacity: 0.1; filter: alpha(opacity = 10); } .opacityNoSpaces_t12685 { opacity: 0.2; filter: alpha(opacity=20); }</style>").appendTo(fixture),
el = jQuery("<div class='opacityWithSpaces_t12685'></div>").appendTo(fixture); el = jQuery("<div class='opacityWithSpaces_t12685'></div>").appendTo(fixture);
equal( Math.round( el.css("opacity") * 100 ), 10, "opacity from style sheet (filter:alpha with spaces)" ); equal( Math.round( el.css("opacity") * 100 ), 10, "opacity from style sheet (filter:alpha with spaces)" );
el.removeClass("opacityWithSpaces_t12685").addClass("opacityNoSpaces_t12685"); el.removeClass("opacityWithSpaces_t12685").addClass("opacityNoSpaces_t12685");
equal( Math.round( el.css("opacity") * 100 ), 20, "opacity from style sheet (filter:alpha without spaces)" ); equal( Math.round( el.css("opacity") * 100 ), 20, "opacity from style sheet (filter:alpha without spaces)" );
el.css( "opacity", 0.3 ); el.css( "opacity", 0.3 );
equal( Math.round( el.css("opacity") * 100 ), 30, "override opacity" ); equal( Math.round( el.css("opacity") * 100 ), 30, "override opacity" );
el.css( "opacity", "" ); el.css( "opacity", "" );
equal( Math.round( el.css("opacity") * 100 ), 20, "remove opacity override" ); equal( Math.round( el.css("opacity") * 100 ), 20, "remove opacity override" );
});
test( ":visible/:hidden selectors", function() {
expect( 13 );
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(window).is(":visible"), "Calling is(':visible') on window does not throw an error in IE.");
ok( jQuery(document).is(":visible"), "Calling is(':visible') on document does not throw an error in IE.");
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)");
var $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>");
equal(jQuery("#table td:visible").length, 0, "hidden cell children not perceived as visible (#4512)");
}); });
asyncTest( "Clearing a Cloned Element's Style Shouldn't Clear the Original Element's Style (#8908)", 24, function() { asyncTest( "Clearing a Cloned Element's Style Shouldn't Clear the Original Element's Style (#8908)", 24, function() {