Bug Tracker

#15204 closed bug (cantfix)

Opened August 07, 2014 08:21PM UTC

Closed August 08, 2014 01:29PM UTC

Binding an event from an iframe content to its parent.window not working properly

Reported by: cm0s Owned by:
Priority: undecided Milestone: None
Component: event Version: 2.1.1
Keywords: iframe, event Cc:
Blocked by: Blocking:
Description

If we bind an event from an iframe content to its parent window and use a property set on the iframe content window in order to update a counter (eg. window.counter), whenever we refresh the iframe page the counter property doesn't seem to be correctly reinitialized. The iframe page should set the window.counter to 0 each time the page is reloaded, but the counter property seems to keep previous value.

I've been able to reproduce this issue on Chrome and Opera. On IE and Firefox there is no issue.

To better expose this issue I created a fiddle snippet:

http://jsfiddle.net/cm0s/WYy6U/3/

To reproduce the issue, first try to click outside the iframe: the counter will increment by 1 each time a click event is triggered. Then, click multiple times on the "Reload this page" link and then click outside the iframe. You will see the counter is now incremented by the number of times you clicked on the link not by 1 as it should.

The same snippet with the use of standard javascript onclick event instead of the $.on() function perfectly works on Chrome, Opera, IE, Firefox :

http://jsfiddle.net/cm0s/D6j5G/1/

Tested browser :

  • Opera 23.0.1522.60 (doesn't work)
  • Chrome 36.0.1985.125 (doesn't work)
  • IE 11.0.9600.17207 (work correctly)
  • Firefox 31 (work correctly)

All jQuery versions seem to be impacted (branches 2.x and 1.x)

Attachments (0)
Change History (1)

Changed August 08, 2014 01:29PM UTC by gibson042 comment:1

resolution: → cantfix
status: new → closed

You appear to have found an unusual browser behavior (I don't even know if it's a bug) appearing in more than one browser. First, note that .off does not remove event handlers added by distinct copies of jQuery (e.g., those from before the frame was reloaded): http://jsfiddle.net/qz8jwtxr/. With that in mind, it looks like the parent.window.onclick = incrementCounter in your working case is destroying the old event handler (as expected), but that the $(parent.window).on('click', incrementCounter) in your nonworking case is not (again, as expected). The ''problem'' is that the iframe window and its contents seem to be the same between reloads, when in fact $('.counter').html(window.counter) of the old handler should have no visible effects (http://jsfiddle.net/su46fr9t/).

I recommend storing your data in a closure variable instead of a property on window, since (among other reasons) window survives reloads.