Comments (10)
@eniovalo just saw this now, sorry for the delay!
Thanks for detailing everything you are expecting / seeing. It should help me re-create the issue on my end, and I'll see what I can come up with for a fix!
from rollup-plugin-polyfill.
@eniovalo I tried re-creating the issue on my end, but I'm not seeing it the $1
after the ResizeObserver. I'm just editing the example in the example folder... I wonder if the babel step is causing the suffix?
Do you think you could create a minimal setup (either based on the example folder in the project or as a brand new gist / github repo), that shows this issue? I want to be sure I can recreate the issue on my machine before I start debugging more.
from rollup-plugin-polyfill.
@JRJurman , I create an example with resizeObserver, it seems that rollup-plugin-polyfill conflicts with new ResizeObserver
and add $1 to the name of the function ResizeObserver$1
. I don't know why.
If you could check it, it will be grateful. =]
from rollup-plugin-polyfill.
Reading the documentation for resize-observer-polyfill, it "recommends" using it as a ponyfill https://github.com/que-etc/resize-observer-polyfill#usage-example but in reality, you have to use it as a ponyfill, see que-etc/resize-observer-polyfill#68
It occurs to me that this would be incompatible with rollup-plugin-polyfill, as we assume that the polyfill should populate the global (as they usually do).
It seems that your usage (at least in the examples you've provided) are not compatible with the usage of the resize-observer-polyfill library.
Conversely, you could write a wrapper around resize-observer-polyfill which populates the global with a ResizeObserver, and then polyfill that wrapper! That should work just fine 👍
from rollup-plugin-polyfill.
@JRJurman , rollup-plugin-polyfill worked with a wrapper of resize-observer-polyfill.
Thanks for the advice! =]
import ResizeObserver from 'resize-observer-polyfill';
//Finding the global variable.
const myGlobal = (function () {
if (typeof global !== 'undefined' && global.Math === Math) {
return global;
}
if (typeof self !== 'undefined' && self.Math === Math) {
return self;
}
if (typeof window !== 'undefined' && window.Math === Math) {
return window;
}
})();
//If ResizeObserver doesn't exist, set the Polyfill.
if(!myGlobal.ResizeObserver) {
myGlobal.ResizeObserver = ResizeObserver;
}
from rollup-plugin-polyfill.
@eniovalo just saw this now, sorry for the delay!
Thanks for detailing everything you are expecting / seeing. It should help me re-create the issue on my end, and I'll see what I can come up with for a fix!
@JRJurman, No problems. =]
Yes, I will create a minimal setup and send to you. ;)
from rollup-plugin-polyfill.
@eniovalo I see the $1 in the builds, but the way these functions are setup, I believe they will still put a ResizeObserver
global on the window object... I tested all three builds on my Linux device, and none of them failed... I can try with IE, but this minimal setup doesn't appear to be causing the issue ResizeObserver is not defined
that you were seeing... At least not on my setup - was there a specific build (iife, commonjs, or umd) that was causing this, or all of them?
from rollup-plugin-polyfill.
Just verified that none of the builds work with IE, but that is because IE needs the code to be transpiled (probably with babel). If you can get a version that shows the error in IE (or any browser), that would be useful.
from rollup-plugin-polyfill.
@JRJurman , I tested the 3 builds (iife, commonjs and umd) with Firefox ESR 68.7 and it failed ResizeObserver is not defined because ResizeObserver
is compatible since Firefox 69 and IE is not compatible. =(
So, I put resize-observer-polyfill with rollup-plugin-polyfill to make it compatible, but it generates ResizeObserver$1. If you change ResizeObserver$1 to ResizeObserver at bundle.js (line 893), it will work at IE. =]
resize-observer-polyfill code (before rollup):
resize-observer-polyfill code (after rollup):
from rollup-plugin-polyfill.
@JRJurman , thanks.
I will create a wrapper to make resize-observer-polyfill global. =]
from rollup-plugin-polyfill.
Related Issues (6)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from rollup-plugin-polyfill.