Project: chromium Issues People Development process History Sign in
New issue
Advanced search Search tips
Starred by 29 users
Status: Started
Owner:
EstimatedDays: ----
NextAction: ----
OS: All
Pri: 3
Type: Task

Blocked on:
issue 674520


Show other hotlists

Hotlists containing this issue:
Hotlist-1


Sign in to add a comment
Resize Observer
Project Member Reported by atotic@chromium.org, May 18 2016 Back to list
Change description:
The Resize Observer API can be used to observe changes to Element's clientWidth and clientHeight.

Changes to API surface:
* A new interface ResizeObserver, and related Entry and Callback interfaces.

Links:

Spec: https://wicg.github.io/ResizeObserver/
Repository: https://github.com/WICG/ResizeObserver/

Public standards discussion: https://github.com/WICG/ResizeObserver/issues

Support in other browsers:
Microsoft: positive https://developer.microsoft.com/en-us/microsoft-edge/platform/status/resizeobserver/
Firefox: positive https://bugzilla.mozilla.org/show_bug.cgi?id=1272409
Safari: positive https://bugs.webkit.org/show_bug.cgi?id=157743
 
Comment 1 by atotic@chromium.org, May 18 2016
Labels: OWP-Standards-MailingList OWP-Design-No M-53
Comment 2 by atotic@chromium.org, May 18 2016
Regarding support in other browsers:
we had a good discussion in CSSWG f2f. They did not hate it, and we got tracking bugs. None of the browsers signaled intent to implement.
Project Member Comment 3 by bugdroid1@chromium.org, Jul 19 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/7d1f9d52e374d32549ace497895d3d2c7b5667b4

commit 7d1f9d52e374d32549ace497895d3d2c7b5667b4
Author: atotic <atotic@google.com>
Date: Tue Jul 19 18:45:19 2016

ResizeObserver pt1: IDLs with stubs

Full ResizeObserver implementation has been split into 7 parts for
cleaner review.

Part 1 is just ResizeObserver IDLs + stubs

Original patch archived at https://codereview.chromium.org/2005593002

BUG=612962

Review-Url: https://codereview.chromium.org/2159883003
Cr-Commit-Position: refs/heads/master@{#406333}

[modify] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/LayoutTests/webexposed/global-interface-listing-expected.txt
[modify] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/core.gypi
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserver.cpp
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserver.h
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserver.idl
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserverCallback.h
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserverCallback.idl
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserverEntry.cpp
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserverEntry.h
[add] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/core/observer/ResizeObserverEntry.idl
[modify] https://crrev.com/7d1f9d52e374d32549ace497895d3d2c7b5667b4/third_party/WebKit/Source/platform/RuntimeEnabledFeatures.in

Project Member Comment 4 by bugdroid1@chromium.org, Jul 22 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/6c23d97a65d8568329a386bd1da1df27d8d0a893

commit 6c23d97a65d8568329a386bd1da1df27d8d0a893
Author: atotic <atotic@google.com>
Date: Fri Jul 22 06:50:33 2016

ResizeObserver implementation, part 2: lifetime

The plot thickens:

This checkin introduces all the classes, and the links
between them. The links are important for object
lifetime management. Lifetime architecture is described
at
https://docs.google.com/document/d/1G4OmqqlFY3H3erQAUmteKES02-bIECikDjWBrDKH9PA/edit?usp=sharing

BUG=612962

ResizeObserver: conecting Objects
Review-Url: https://codereview.chromium.org/2161313002
Cr-Commit-Position: refs/heads/master@{#407088}

[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/core.gypi
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/dom/Document.cpp
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/dom/Document.h
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/dom/Element.cpp
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/dom/Element.h
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/dom/ElementRareData.cpp
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/dom/ElementRareData.h
[add] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObservation.cpp
[add] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObservation.h
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObserver.cpp
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObserver.h
[add] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObserverController.cpp
[add] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObserverController.h
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObserverEntry.cpp
[modify] https://crrev.com/6c23d97a65d8568329a386bd1da1df27d8d0a893/third_party/WebKit/Source/core/observer/ResizeObserverEntry.h

Project Member Comment 5 by bugdroid1@chromium.org, Jul 26 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/03e20c08515f228ac05c74aca0645d3bf6ab1598

commit 03e20c08515f228ac05c74aca0645d3bf6ab1598
Author: atotic <atotic@google.com>
Date: Tue Jul 26 08:29:07 2016

ResizeObserver pt3: observation computation

This patch fills in ResizeObservation functionality:
- computing/setting observation size
- determining target depth

ResizeObservation::getTargetSize is static because it will also
get used by ResizeObserverEntry

I've also included basic C++ tests.

BUG=612962

Review-Url: https://codereview.chromium.org/2173203002
Cr-Commit-Position: refs/heads/master@{#407736}

[modify] https://crrev.com/03e20c08515f228ac05c74aca0645d3bf6ab1598/third_party/WebKit/Source/core/observer/ResizeObservation.cpp
[modify] https://crrev.com/03e20c08515f228ac05c74aca0645d3bf6ab1598/third_party/WebKit/Source/core/observer/ResizeObservation.h
[modify] https://crrev.com/03e20c08515f228ac05c74aca0645d3bf6ab1598/third_party/WebKit/Source/core/observer/ResizeObserver.h
[add] https://crrev.com/03e20c08515f228ac05c74aca0645d3bf6ab1598/third_party/WebKit/Source/web/tests/ResizeObserverTest.cpp
[modify] https://crrev.com/03e20c08515f228ac05c74aca0645d3bf6ab1598/third_party/WebKit/Source/web/web.gypi

Project Member Comment 6 by bugdroid1@chromium.org, Jul 26 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/a254bd8afdb92836a9b626cd5ff0789bb932d2ce

commit a254bd8afdb92836a9b626cd5ff0789bb932d2ce
Author: atotic <atotic@google.com>
Date: Tue Jul 26 23:42:03 2016

ResizeObserver pt4: IDL methods

Implements ResizeObserver and ResizeObserverEntry IDL calls.

observe/unobserver connect ResizeObserver and Element through ElementRareData.
ElementRareData has a map (ResizeObserver->ResizeObservation)

Design doc at: https://docs.google.com/document/d/1G4OmqqlFY3H3erQAUmteKES02-bIECikDjWBrDKH9PA/edit?usp=sharing
BUG=612962

Review-Url: https://codereview.chromium.org/2185533004
Cr-Commit-Position: refs/heads/master@{#407973}

[modify] https://crrev.com/a254bd8afdb92836a9b626cd5ff0789bb932d2ce/third_party/WebKit/Source/core/observer/ResizeObserver.cpp
[modify] https://crrev.com/a254bd8afdb92836a9b626cd5ff0789bb932d2ce/third_party/WebKit/Source/core/observer/ResizeObserverEntry.cpp
[modify] https://crrev.com/a254bd8afdb92836a9b626cd5ff0789bb932d2ce/third_party/WebKit/Source/core/observer/ResizeObserverEntry.h

Project Member Comment 7 by bugdroid1@chromium.org, Jul 30 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5

commit 3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5
Author: atotic <atotic@google.com>
Date: Sat Jul 30 07:03:29 2016

ResizeObserver pt5: size change notification

This change implements size change notification algorithm.
Design doc at https://docs.google.com/document/d/1G4OmqqlFY3H3erQAUmteKES02-bIECikDjWBrDKH9PA/edit?usp=sharing

Size change notification
We collect and deliver notifications about all Elements
whose size has changed inside the event loop.
The algorithm loops until all notifications are delivered,
or it hits the depth limit.

c = ResizeObserverController();
for (limit = c.gatherObservations(0);
      limit != ResizeObserverController::kDepthLimit;
      limit = c.gatherObservations(limit)) {
      	c.deliverObservations();
      }
      if (c.skippedObservations()) {
        c.clearObservations();
        sendError()
      }

For efficiency, we avoid continuosly polling all elements
for size changes. Instead, an Element notifies ResizeObservation
when its size might have changed. ResizeObservation propagates
this change to ResizeObserver, which propagates to
ResizeObserverController. All of them set a flag indicating that
they might have been changed.
The flag is cleared when observations are delivered.

BUG=612962

Review-Url: https://codereview.chromium.org/2188983003
Cr-Commit-Position: refs/heads/master@{#408867}

[modify] https://crrev.com/3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5/third_party/WebKit/Source/core/observer/ResizeObservation.cpp
[modify] https://crrev.com/3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5/third_party/WebKit/Source/core/observer/ResizeObservation.h
[modify] https://crrev.com/3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5/third_party/WebKit/Source/core/observer/ResizeObserver.cpp
[modify] https://crrev.com/3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5/third_party/WebKit/Source/core/observer/ResizeObserver.h
[modify] https://crrev.com/3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5/third_party/WebKit/Source/core/observer/ResizeObserverController.cpp
[modify] https://crrev.com/3d5b99673799a3067e9a5b8621f2b9ef2ff5d5d5/third_party/WebKit/Source/core/observer/ResizeObserverController.h

Project Member Comment 8 by bugdroid1@chromium.org, Aug 12 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/5b49641e336ba9be7789cc0eb2511d415f4e6d5d

commit 5b49641e336ba9be7789cc0eb2511d415f4e6d5d
Author: atotic <atotic@google.com>
Date: Fri Aug 12 17:42:46 2016

ResizeObserver pt6: integration

Integrates ResizeObserver with the browser.

1) Element notifies ResizeObserver when its size might have changed.

Operations that might change Element's observed size are trapped:
Element::detachLayoutTree traps Element removal from DOM tree
LayoutObject::setMayNeedPaintInvalidation traps size changes

2) Event loop integration

FrameView::notifyResizeObserver implements it per spec.
https://wicg.github.io/ResizeObserver/#html-event-loop

3) Tests

LayoutTests/resize-observer is a comprehensive test suite.

BUG=612962

Review-Url: https://codereview.chromium.org/2204503002
Cr-Commit-Position: refs/heads/master@{#411694}

[add] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/LayoutTests/resize-observer/eventloop.html
[add] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/LayoutTests/resize-observer/notify.html
[add] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/LayoutTests/resize-observer/observe.html
[add] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/LayoutTests/resize-observer/resources/iframe.html
[add] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/LayoutTests/resize-observer/resources/resizeTestHelper.js
[add] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/LayoutTests/resize-observer/svg.html
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/dom/Element.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/dom/Element.h
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/frame/FrameView.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/frame/FrameView.h
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/LayoutBox.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/LayoutBox.h
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/svg/LayoutSVGContainer.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/svg/LayoutSVGEllipse.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/svg/LayoutSVGImage.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/svg/LayoutSVGPath.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/svg/LayoutSVGRect.cpp
[modify] https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d/third_party/WebKit/Source/core/layout/svg/LayoutSVGShape.cpp

Project Member Comment 9 by bugdroid1@chromium.org, Aug 16 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/3f41316c60eb95369602fde0ebf52e935a3a91d5

commit 3f41316c60eb95369602fde0ebf52e935a3a91d5
Author: atotic <atotic@google.com>
Date: Tue Aug 16 03:00:07 2016

ResizeObserver pt6: integration

Integrates ResizeObserver with the browser.

1) Element notifies ResizeObserver when its size might have changed.

Operations that might change Element's observed size are trapped:
Element::detachLayoutTree traps Element removal from DOM tree
LayoutObject::setMayNeedPaintInvalidation traps size changes

2) Event loop integration

FrameView::notifyResizeObserver implements it per spec.
https://wicg.github.io/ResizeObserver/#html-event-loop

3) Tests

LayoutTests/resize-observer is a comprehensive test suite.

BUG=612962

Committed: https://crrev.com/5b49641e336ba9be7789cc0eb2511d415f4e6d5d
Review-Url: https://codereview.chromium.org/2204503002
Cr-Original-Commit-Position: refs/heads/master@{#411694}
Cr-Commit-Position: refs/heads/master@{#412149}

[add] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/LayoutTests/resize-observer/eventloop.html
[add] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/LayoutTests/resize-observer/notify.html
[add] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/LayoutTests/resize-observer/observe.html
[add] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/LayoutTests/resize-observer/resources/iframe.html
[add] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/LayoutTests/resize-observer/resources/resizeTestHelper.js
[add] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/LayoutTests/resize-observer/svg.html
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/dom/Element.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/dom/Element.h
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/frame/FrameView.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/frame/FrameView.h
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/LayoutBox.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/LayoutBox.h
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/svg/LayoutSVGContainer.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/svg/LayoutSVGEllipse.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/svg/LayoutSVGImage.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/svg/LayoutSVGPath.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/svg/LayoutSVGRect.cpp
[modify] https://crrev.com/3f41316c60eb95369602fde0ebf52e935a3a91d5/third_party/WebKit/Source/core/layout/svg/LayoutSVGShape.cpp

The chromestatus entry for this feature seems to have the wrong launch bug link.
https://www.chromestatus.com/feature/5705346022637568 links to issue 540528 instead of to this issue.
Comment 11 Deleted
Comment 12 Deleted
Fixed, thanks.
Comment 14 by que....@gmail.com, Aug 30 2016
I've raised two issues:
 issue 641353 
 issue 641364 

Not sure though if it's not too early to file bugs.
Project Member Comment 15 by bugdroid1@chromium.org, Aug 31 2016
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/01cdf399a2720f0ac49cd3512c0cdfc8b0439f68

commit 01cdf399a2720f0ac49cd3512c0cdfc8b0439f68
Author: atotic <atotic@google.com>
Date: Wed Aug 31 19:09:58 2016

A new C++ test for ResizeObserver GC.

It tests whether ResizeObserver is kept alive by:
- direct javascript reference
- observing a live element.

BUG=612962

Review-Url: https://codereview.chromium.org/2272163003
Cr-Commit-Position: refs/heads/master@{#415711}

[modify] https://crrev.com/01cdf399a2720f0ac49cd3512c0cdfc8b0439f68/third_party/WebKit/Source/core/observer/ResizeObserverController.h
[modify] https://crrev.com/01cdf399a2720f0ac49cd3512c0cdfc8b0439f68/third_party/WebKit/Source/web/tests/ResizeObserverTest.cpp

I just reported  Issue 658593 . Could you have a look? ;)
Blockedon: 674520
Any progress on this? I would really like to see this being standard.
All bugs have been fixed. Making our way through release process. Currently inside a TAG review:

https://github.com/w3ctag/design-reviews/issues/187
Project Member Comment 20 by bugdroid1@chromium.org, Sep 1
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/bd8bd7e7ba3f4283499e576d080549ac6f34cf60

commit bd8bd7e7ba3f4283499e576d080549ac6f34cf60
Author: Aleks Totic <atotic@chromium.org>
Date: Fri Sep 01 22:42:22 2017

Add OWNERS to resize-observer

Bug: 612962
Change-Id: I672c800d9bf1612d90fa06bc97c3e9f512c9e096
Reviewed-on: https://chromium-review.googlesource.com/611319
Reviewed-by: Dirk Pranke <dpranke@chromium.org>
Commit-Queue: Aleks Totic <atotic@chromium.org>
Cr-Commit-Position: refs/heads/master@{#499332}
[add] https://crrev.com/bd8bd7e7ba3f4283499e576d080549ac6f34cf60/third_party/WebKit/Source/core/resize_observer/OWNERS

Labels: migrated-launch-owp Type-Task
This issue has been automatically relabelled type=task because type=launch-owp issues are now officially deprecated. The deprecation is because they were creating confusion about how to get launch approvals, which should be instead done via type=launch issues.

We recommend this issue be used for implementation tracking (for public visibility), but if you already have an issue for that, you may mark this as duplicate.

For more details see here: https://docs.google.com/document/d/1JA6RohjtZQc26bTrGoIE_bSXGXUDQz8vc6G0n_sZJ2o/edit

For any questions, please contact owencm, sshruthi, larforge
Sign in to add a comment