mdl-ext icon indicating copy to clipboard operation
mdl-ext copied to clipboard

Implement ResizeObserver api

Open leifoolsen opened this issue 7 years ago • 2 comments

The ResizeObserver describes an API for observing changes to Element’s size.

ResizeObserver is explained here: https://github.com/WICG/ResizeObserver/blob/master/explainer.md

Resize Observer draft: https://wicg.github.io/ResizeObserver/

leifoolsen avatar Aug 21 '16 10:08 leifoolsen

Hi! I just wanted to say that there are several issues in current implementation:

  • document.resizeObservers - this list is not supposed to be available to the JS part as in the spec it's described under the section "Internal Slot Definitions". You can also check the native Chrome implementation which is available under the flag since v54 (Canary).
  • getBoundingClientRect - I think that it's better to avoid using gbcr at all as it's client rectangle is affected not only by borders and paddings but also by the CSS transformations. Besides if are using it you will trigger notifications for inline elements (spec). As I see it the best thing to do is to use clientWidth and clientHeight for the computations. This way you will only need to subtract the paddings data.
  • contentRect - it lacks right and bottom properties, where bottom equals to CSSHeight + paddingTop and right is a result of CSSWidth + paddingLeft.
  • SVG elements - as for now they are completely ignored. Is this intentional?

Thanks. And please excuse me if I've wrote this ahead of time.

que-etc avatar Sep 12 '16 17:09 que-etc

Hello @que-etc Thank you for your feedback.

  • document.resizeObservers. I'll unexpose the array.
  • getBoundingClientRect. I'll use clientWidth/Height as you suggests
  • SVG. The idea was to leave SVG until everything else was completed
  • contentRect. Completed with x,y width, height - but still with gbcr.
  • Further I'll replace rAf with a combination of MutationObserver, windowresize and orientationchange.

The most recent code for my ResizeObserver is in this branch. It was by accident pushed to master some time ago. I havent taken myself the trouble to remove the code from master.

When I look through your repo it may seem that your ResizeObserver code is more mature than my implementation. I could probably find a lot of useful information there, or I can discard my code and use your library.

Regards

leifoolsen avatar Sep 13 '16 17:09 leifoolsen