When an IFRAME is moved within its parent's DOM tree (e.g., to wrap it inside another element), its contents get reloaded, which can be undesireable. In addition, Safari will report that it is still trying to load something.
The reduction at http://pilgrimwebdesign.com/iframe_move.html should demonstrate this. What should happen is that the IFRAME is simply moved, with no impact on the state of its contents.
What does happen is that the load and unload events of the IFRAME fire each time the IFRAME is moved. In addition, the status bar reads:
Loading "http://pilgrimwebdesign.com/iframe_move.html", completed 3 of n items
where n starts at 4 and increments by one each time the IFRAME is moved.
This occurs in Safari 2.0.4 as well as the nightly.
I cannot confirm the bug in Webkit r30549.
I get this all the time.
What do other browsers do? Do they distinguish between an atomic move and a removal followed by an insertion?
If we document other browser's behavior (specifically MSIE and Firefox), it will be easily to know how to fix WebKit.
Firefox 2 and 3 behave the same as WebKit/Safari (tested nightly build r35249). The iframe is reloaded as it moves in the DOM, and both load and unload events are called during this change.
Opera 9.24 and 9.51 behave the same as WebKit/Safari, except that no unload events are called.
MSIE 5.23 for Mac OS X, ironically, behaves "as expected". There are no load or unload events as it is moved within the DOM!
Will test MSIE 7 next.
(In reply to comment #6)
> Firefox 2 and 3 behave the same as WebKit/Safari (tested nightly build r35249).
> The iframe is reloaded as it moves in the DOM, and both load and unload events
> are called during this change.
> Opera 9.24 and 9.51 behave the same as WebKit/Safari, except that no unload
> events are called.
> MSIE 5.23 for Mac OS X, ironically, behaves "as expected". There are no load
> or unload events as it is moved within the DOM!
MSIE 7 behaves "as expected" in this case. There are no load or unload events as it is moved within the DOM.
See also bug 32848.
Mozilla still has the same problem, 5.5 years after first reported:
Funny that IE is the only one that 'does the right thing' here - considering its usually the egregious offender.
There is now a work around for this bug, discussed in the comments to bug 32848. You can use adoptNode() to move the iframe around, which will suppress the reload.
Eventually this workaround should work on Mozilla, too (although not soon: see http://groups.google.com/group/mozilla.dev.tech.dom/browse_thread/thread/960efae1f2ca7bfb?pli=1)
Just chiming in here. This rears its head as an issue in jQueryUI: http://bugs.jqueryui.com/ticket/9067
We tried do support this use case via magic iframe and failed: http://trac.webkit.org/changeset/111361
Keeping iframe alive while it's being moved inside a document is too hard.
I'm not sure this ticket should be closed. I'm not asking for magic IFRAME. There was work done in 32848 that references this ticket implementing something once that was fixed.
The adoptNode workaround mentioned in comment #12 is depending on someone implementing something further.
I could be reading it wrong, but it looks like there was work done for this.
A jsfiddle seems to indicate that the IFRAME still reloads: http://jsfiddle.net/jNLWw/
Forgive me if I'm misunderstanding.
(In reply to comment #13)
> A jsfiddle seems to indicate that the IFRAME still reloads: http://jsfiddle.net/jNLWw/
That's the expected behavior. We have fixed this bug by adding a support for magic iframe but we had to remove that feature because it introduced lots of security vulnerabilities and other kinds of bugs.
Such as, we're not going to provide a way to move an iframe inside a DOM without reloading the content.