ResizeObserver polyfill does not work when bundled

What

ResizeObserver is undefined when the RO polyfill script is used.

repro: https://codesandbox.io/s/polyfill-io-resizeobserver-failing-to-install-t3pwln?file=/src/polyfill.js

Details

Required setup:

• Use Safari (or any browser that doesn’t have Resize Observer)
• Go to Safari devtools and disable Resize Observer ** Develop > Experimental Features > Uncheck Resize Observer
• go to https://t3pwln.csb.app/

Upon visiting that page you’ll see ReferenceError: Can't find variable: ResizeObserver

I’m at a bit of a loss why this isn’t working.

What I’ve done is just copy/paste the output from https://polyfill.io/v3/polyfill.js?version=3.110.1&features=ResizeObserver using a spoofed UA of

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/12.0.2 Safari/E7FBAF

But whats really mind bending is if I use the polyfill.io script in the index.html the polyfill works as expected.

What am I missing here?

[wesgro]

Apologies, this appears to be something with how we bundle the polyfills that breaks the UMD in this case. Will investigate locally.

[wesgro]

Ideally we have some way to test and verify polyfills when bundled. This guards users against regressions. Having tests of this nature is very difficult. We also have to be careful that the fix for your setup isn’t a bug for someone else.

Agree! This is a tricky problem…

On my end I can always patch the package to modify the RO implementation to work for us if a change here is seen as too risky. So far changing it to use exports has been fruitful but I can’t guarantee anything outside of my usage