Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Implement ResizeObserver api #69

Open
leifoolsen opened this issue Aug 21, 2016 · 2 comments
Open

Implement ResizeObserver api #69

leifoolsen opened this issue Aug 21, 2016 · 2 comments

Comments

@leifoolsen
Copy link
Owner

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/

@que-etc
Copy link

que-etc commented Sep 12, 2016

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.

@leifoolsen
Copy link
Owner Author

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants