Skip to content

Conversation

williamisnotdefined
Copy link

@williamisnotdefined williamisnotdefined commented Jan 24, 2025

[useMeasure] ResizeObserverOptions added as prop

Now useMeasure accepts an observerOptions as parameter, plus the hook will also return the element ref in its last argument, just in case of some need.

This PR try to solve the issue 2501.
It is a really small change that shouldn't affect the current hook behavior if a parameter is not provided.
Almost sure I forgot something in the PR flow, please, just let me know.

Type of change

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as before)

Checklist

  • Read the Contributing Guide
  • Perform a code self-review
  • Comment the code, particularly in hard-to-understand areas
  • Add documentation
  • Add hook's story at Storybook
  • Cover changes with tests
  • Ensure the test suite passes (yarn test)
  • Provide 100% tests coverage
  • Make sure code lints (yarn lint). Fix it with yarn lint:fix in case of failure.
  • Make sure types are fine (yarn lint:types).

@williamisnotdefined
Copy link
Author

williamisnotdefined commented Jan 24, 2025

yarn lint:types returns the error:

Cannot find name 'ResizeObserverOptions'

The resize-observer-polyfill does not support the options parameter in observer function:

declare global {
    interface ResizeObserverCallback {
        (entries: ResizeObserverEntry[], observer: ResizeObserver): void
    }

    interface ResizeObserverEntry {
        readonly target: Element;
        readonly contentRect: DOMRectReadOnly;
    }

    interface ResizeObserver {
        observe(target: Element): void; /* Here we should have the second parameter `options` */
        unobserve(target: Element): void;
        disconnect(): void;
    }
}

I think ResizeObserver is widely supported nowadays, source: CanIUse

image

Should we still rely upon the polyfill?
I have added a ts-ignore comment and it is explained in useMeasure documentation that we should check in CanIUse the compatibility of ResizeObserverOptions in the user supported browsers.

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

Successfully merging this pull request may close these issues.

1 participant