Opened 10 years ago

Closed 10 years ago

#8561 closed defect (fixed)

Visible IFRAMEs when using Dijits on IE6

Reported by: alexh Owned by: bill
Priority: high Milestone: 1.3
Component: Dijit Version: 1.2.3
Keywords: Cc:
Blocked By: Blocking:

Description (last modified by bill)

I have a problem with the usage of IFRAMEs on IE6; basically, whenever you dojo.require() certain dijits a big IFRAME appears in the top-left.

The IFRAME disappears when used (e.g., a popup calendar, a dijit.Dialog, etc.), and when not used it doesn't "reappear", if that makes sense.

The offending code is in dijit/_base/popup.js:245

  var burl = dojo.config["dojoBlankHtmlUrl"] ||
    (dojo.moduleUrl("dojo", "resources/blank.html")+"") || 
  var html="<iframe src='" + burl + "'"
     + " style='position: absolute; left: 0px; top: 0px;"
     + "z-index: -1; filter:Alpha(Opacity=\"0\");'>";
  iframe = dojo.doc.createElement(html);

(Reformatted slightly for readability). This is only used on IE, phiggins told me on IRC it was needed to prevent bleed-through of SELECT.

I tried moving it off-screen by setting large negative left/top; that prevents it being shown, but stops it fixing the bleed-through (presumably, it doesn't get moved into the correct position).

I have no idea why the opacity setting doesn't hide it; I also tried display: none (didn't work) and visibility: hidden (seemed to work). Setting width: 0px; height: 0px; also worked, and that's what I'm running with.

I don't know which of those you might want to pick, but I'll help test different options.

Setting a high severity because this does make Dojo quite unusable for IE6 people (spit, etc.).

Change History (5)

comment:1 Changed 10 years ago by bill

Description: modified (diff)
Milestone: tbd1.3
Owner: set to bill
Status: newassigned

Hmm it's strange that you are seeing that but we don't see it in our tests. I looked at the code though and the code does seem strange, particularly the push functions (which caches iframes for future use):

this.push = function(iframe){"";

Seems like that should be setting display to none.

Do you have a test case? Or does it reproduce for you for any of the tests in dijit/tests?

comment:2 Changed 10 years ago by alexh

Thanks for looking at this. An obvious test case is this one:

... but I think any case where there is a pop-up UI element or where the dijit is initially hidden somehow should show it up. I've noticed it on various Dojo Campus pages as well.

I agree about the display diddling - if you look at line 30 of popup.js, there's also this little stanza:

if(s.display == "none"){

I assumed that there was some overriding reason why display had to keep being reset if it was "none", but I totally don't understand the comment preceding it - it's talking about not wanting the widget to appear on the page. As I understand CSS, anything with display:none; is totally removed from the layout and doesn't generate a box at all. But clearly someone at some point was trying to fix a problem there...

comment:3 Changed 10 years ago by alexh

Sorry for the bugspam; I also meant to add - once the IFRAME is put back in the pool, after whatever widget has been displayed / popped up / etc., it actually doesn't reappear at the top of the screen.

So, on the TooltipDialog? test, there's a visible IFRAME at the top-left when you first load the page. If you then click one of the dropdowns, it goes away and doesn't come back for the rest of that page session.

comment:4 Changed 10 years ago by bill

Hmm, that page works fine for me and most others, hence why no one else has reported this.

Using IE Dom explorer I can see that the iframe is in the top left, about 1" x 3", but it's not visible, presumably since z-index == -1 and opacity == 0.

Anyway, I think I can just take out the code to prime the iframe cache altogether. We are pre-creating an iframe on page-load so that the display of the initial drop down is faster, but maybe that's not even worth it since of course it slows down page load.

comment:5 Changed 10 years ago by bill

Resolution: fixed
Status: assignedclosed

(In [16540]) Fixes #8561: Visible IFRAMEs when using Dijits on IE6

I removed the code to pre-create a background iframe on IE6 on page load. This code was added in [10099] (refs #4057) to prevent a 2s delay on IE6 showing the first popup, but I'm not seeing that problem anymore, and the code is questionable anyway since it slows down page load time.

Note: See TracTickets for help on using tickets.