Bug 17969 - Element onresize does not work
Summary: Element onresize does not work
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: DOM (show other bugs)
Version: 528+ (Nightly build)
Hardware: PC OS X 10.5
: P2 Normal
Assignee: Nobody
Keywords: HasReduction
Depends on:
Reported: 2008-03-20 11:35 PDT by Erik Arvidsson
Modified: 2013-06-09 15:53 PDT (History)
5 users (show)

See Also:

Resize the window to trigger the resize event (428 bytes, text/html)
2008-03-20 11:36 PDT, Erik Arvidsson
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Erik Arvidsson 2008-03-20 11:35:04 PDT
When an element is resize (for whatever reason) it should fire a resize event.  This event is very important for creating reusable UI components that need to do js layout logic.

IE has had this event since version 4.

Test case coming up
Comment 1 Erik Arvidsson 2008-03-20 11:36:19 PDT
Created attachment 19900 [details]
Resize the window to trigger the resize event
Comment 2 Eric Seidel (no email) 2008-03-20 12:04:37 PDT
FF3 fails the attached test case.  Which means unless someone is going through the painful process of trying to right a "next gen" web application in IE7, I don't think they'll be using this event. :)
Comment 3 William J. Edney 2009-03-30 15:06:47 PDT
Yes and Erik, to his credit, filed this bug there too... back in 2003...


My mom taught me that two wrongs don't make a right :-).

Seriously, this capability (the ability to observe size changes at an element level - i.e. as various CSS rules come into and go out of effect), is crucial to doing web-based UI components without resorting to 'JS monitors'.

At minimum, this bug shouldn't be left as 'unconfirmed' when it clearly has been confirmed.


- Bill
Comment 4 Eric Seidel (no email) 2009-03-30 15:12:50 PDT
We don't follow bugzilla's arbitrary conventions very closely here in WebKit land. :)

In order to fix this, we need to know *what* onresize is supposed to do?  When should it fire?  Synchronously with the resize?  After all resizes have happened?  Does it bubble?  I assume that addEventListener("resize") is supposed to work too.

Someone effectively needs to write a little mini spec, and associated test cases, if we're going to be able to fix this.  Until we know what exact behavior we're supposed to add, it's hard to write the code. :)
Comment 5 William J. Edney 2009-03-30 15:27:06 PDT
Eric -

Thanks for the quick reply!

A comment from the Mozilla bug report states that the 'resize' event is documented in the DOM Level 3 events spec. And so it is:


Looks like its not cancelable, it bubbles and can be targeted at a Document or Element.

Since its a DOM event, I would assume that the 'addEventListener("resize", ..., ...)' syntax should work.

In so far as how it actually gets fired, that's not specified. As a JS programmer who's not a C/Webkit guy ;-), I guess it would depend on how the Webkit engine is structured. I know that sitting on my side of the fence, my expectation would be that all 'resize' events get queued until the reflow is complete. But then my handlers would be invoked before painting/blitting such that I can resize other elements thereby recursing back into the engine . That is a totally WAG (wide a**ed guess and others with *much* more experience than I may want to chime in here... hint hint :-) ).

Of course, the potential exists here for folks in my world (JS) to write handlers that then try to resize the target element that just got resized, thereby setting up an infinite loop... but then again, that's their problem.

If you feel like you need more detail, I'd be willing to write some tests here to 'document' IE's current behavior and let that drive a mini-spec of some sort. Maybe Arv has some more to add here.


- Bill
Comment 6 Eric Seidel (no email) 2009-03-30 15:37:21 PDT
Interesting, I did not realize there was any spec-work around a resize event.  The spec sure doesn't have much to say about it. :)  But it does look like something that we could consider supporting.

Every RenderObject::layout() implementation would have to notify the document that a resize of the corresponding node had occurred.  A list would be kept by the Document, and then from that list, events would be dispatched after the layout() had occurred.

One question would be what the behavior of the list should be if a resize is triggered during a resize js handler (set some size property and then trigger a layout).  I assume it should be a FIFO queue and that the remaining resize events from the previous resize should be fired before the new ones are.  But maybe the queue should just be cleared on any new layout?

Either way, it looks like even though there is some minor specwork, there is no testing, or exploration of the various edge conditions. ;)  Something any implementor would have to explore.
Comment 7 Erik Arvidsson 2009-03-31 20:45:50 PDT
I'm pretty sure that resize events do not bubble in IE.

I'm willing to write a mini design doc for this that covers how IE works.

I think it is important to make sure that we can minimize the work needed to do this. For example, it might make more sense to fire the event when we know that the element will change size but before we complete the reflow so that we do not do unnecessary reflows if the size changes due to the event handler.
Comment 8 Lea Verou 2011-12-19 21:55:12 PST
What's the progress of this bug?

If I'm interpreting the DOM3 Events spec correctly, it should also fire on every element, when resized by the user due to the CSS resize property. It doesn't.

Testcase: http://dabblet.com/result/gist/1498895