Bug Tracker

Modify

Ticket #5670 (closed bug: duplicate)

Opened 4 years ago

Last modified 2 years ago

:visible broken in IE8 on element following a display:inline

Reported by: geoffreyk Owned by:
Priority: major Milestone: 1.4.2
Component: core Version: 1.4.1
Keywords: :visible IE8 inline Cc:
Blocking: Blocked by:

Description

Attached is a test file. To repro the bug, load the file in different browsers. All browsers except IE8 report 1 visible div and class .bbb is not visible. IE8 report 2 visible divs and .bbb is visible.

This is as boiled-down as I can get it. The same bug happens using elements other than div.

This is triggered by .aaa with display:inline preceding .bbb. Without display:inline, this test works as expected

The problem seems to be in this line in sizzle (the same problem seems to be happening with the nightly build)

Sizzle.selectors.filters.visible = function(elem){

return elem.offsetWidth > 0
elem.offsetHeight > 0;

};

IE8, in this case only, is reporting the true width and height even though the element is hidden. All other browsers report height and width of 0 when element is hidden

I have set the Priority to 'major' even though I think it might be worthy of 'critical'. I believe that :visible is an important feature of jQuery, and to be not reliable in such a simple situation in IE8 is a problem that must be addressed.

Attachments

IE8_visible_after_inline.html Download (1.1 KB) - added by geoffreyk 4 years ago.
IE8 visible after inline

Change History

Changed 4 years ago by geoffreyk

IE8 visible after inline

comment:1 Changed 4 years ago by dmethvin

The IE8 debugger reports that the display:none div is 4x17 pixels! If you select that div in the debugger it shows the div as being at the end of the inline div. However, if you set the backgroundColor the supposed 4x17 area does not change color.

If the preceding inline div is changed to block, the hidden div correctly shows 0x0 pixels.

IE deserves a big lump of coal for this one.

comment:2 Changed 4 years ago by geoffreyk

Yeah, but what are we going to do about it? I would hate to add a check just for IE8 in this routine

comment:3 Changed 4 years ago by geoffreyk

Possible solution: add an extra term to the logic in Sizzle.selectors.filters.hidden

I am not sure if this will break the fix that was included for ticket #4512. It does seem to fix this specific problem.

change (width !== 0 && height !== 0 && !force) ?

to

(width !== 0 && height !== 0 && !force && jQuery.curCSS(elem, "display") !== "none") ?

Complete function:

Sizzle.selectors.filters.hidden = function(elem) {

var width = elem.offsetWidth, height = elem.offsetHeight, force = /tr$/i.test(elem.nodeName); ticket #4512 return (width === 0 && height === 0 && !force) ?

true :

(width !== 0 && height !== 0 && !force) ?

false :

!!(jQuery.curCSS(elem, "display") === "none");

};

to:

Sizzle.selectors.filters.hidden = function(elem) {

var width = elem.offsetWidth, height = elem.offsetHeight, force = /tr$/i.test(elem.nodeName); ticket #4512 return (width === 0 && height === 0 && !force) ?

true :

(width !== 0 && height !== 0 && !force && jQuery.curCSS(elem, "display") !== "none") ?

false :

!!(jQuery.curCSS(elem, "display") === "none");

};

comment:4 Changed 4 years ago by geoffreyk

or perhaps targeting a bit more directly for IE

(width !== 0 && height !== 0 && !force && ((elem.currentStyle) ? elem.currentStyle.display !== 'none' : true)) ?

Not sure which approach would be better

comment:5 Changed 4 years ago by john

  • Component changed from unfilled to core

I'm having a really hard time duplicating this problem in IE 8, even with the provided test case.

I uploaded it here:  http://ejohn.org/files/bugs/inline/IE8_visible_after_inline.html

And I keep getting 1 found div and .bbb is not visible (which is the correct output).

comment:6 Changed 4 years ago by geoffreyk

Strange. I just verified this on three other IE8 machines from your page and got the expected buggy output. visible divs = 2 and bbb visible is visible. were you somehow in ie7 mode? something else?

comment:7 follow-up: ↓ 13 Changed 4 years ago by geoffreyk

*Note, this may not be a bug in XP + IE8. Has been verified with Vista + IE8 and Win7 + IE8

comment:8 Changed 4 years ago by john

See also #5732.

comment:9 Changed 4 years ago by john

  • Version changed from 1.4a1 to 1.4.1
  • Milestone changed from 1.4 to 1.4.2

comment:10 Changed 4 years ago by bvrob

FYI - I can confirm that this bug will reproduce on XP SP3 + IE8 (8.0.6001.18702).

Fortunately, I can work around this in my case by replacing "$(...).is(':visible')" with "$(...).css('display') !== 'none'".

comment:11 Changed 3 years ago by snover

  • Status changed from new to closed
  • Resolution set to duplicate

This should be fixed in 1.4.3 and later.

comment:12 Changed 3 years ago by snover

Duplicate of #4512.

comment:13 in reply to: ↑ 7 Changed 3 years ago by kralco626

Replying to geoffreyk:

*Note, this may not be a bug in XP + IE8. Has been verified with Vista + IE8 and Win7 + IE8

I did not officially test it with this test case, but I have the same issue in xp + ie8.

Please follow the  bug reporting guidlines and use  jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.

View

Add a comment

Modify Ticket

Action
as closed
Author


E-mail address and user name can be saved in the Preferences.

 
Note: See TracTickets for help on using tickets.