search

mapbox / mapbox-gl-geocoder

Geocoder control for mapbox-gl-js using Mapbox Geocoding API
https://mapbox.com/mapbox-gl-js/example/mapbox-gl-geocoder/
ISC License
363 stars 180 forks source link

Transpilation / IE11 Support #367

Open antony opened 4 years ago

antony commented 4 years ago

I've noticed an issue in IE11 whereby the geocoder won't load unless polyfills exist for all the missing APIs which exist in it.

It's worth noting that Mapbox GL itself is transpiled correctly for this scenario.

Rather than relying on consumers of my component to polyfill their site, it might be worth addressing these issues.

I believe the exact error is from the Object.values/entries Array.from/.forEach family, but I don't know for sure due to the minification.

Is there a notion of browser-support with this library?

Screenshot from 2020-06-20 10-13-19

antony commented 4 years ago

Screenshot from 2020-06-20 10-33-49

There appear to be quite a few issues in fact, and this is with polyfills:

<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,fetch,Array.prototype.find,Object.values,Object.entries,Array.prototype.includes"></script>
andrewharvey commented 4 years ago

I'd like to try and keep browser support in line with GL JS, with the exception that we require a Promise polyfill because Mapbox SDK JS requires a Promise polyfill.

antony commented 4 years ago

After a bunch of debugging, it looks like the current v4.5.1 release won't work without NodeList.forEach, due to this line:

https://github.com/mapbox/mapbox-gl-geocoder/blob/v4.5.1/lib/index.js#L127

It can be trivially polyfilled with:

if (window.NodeList && !NodeList.prototype.forEach) {
   NodeList.prototype.forEach = Array.prototype.forEach;
}

but, this code is gone in master, so hopefully it will be resolved by the next release, so I'll close this for now, pending the next release!