es5 bundle not working on IE11

[Clebiez]

Hey @simonwep thanks for maintaining this package !

What is the current behavior?

For the 1.6.0 release, es5 bundle not working on old browser.
Using core-js w/ babel-preset-env not fix the problem.

Please provide the steps to reproduce and create a [JSFiddle]

Open https://jsfiddle.net/Simonwep/qx2Lod6r/ or https://simonwep.github.io/pickr/ with an old browser like IE11.
You will see in the console an error.

By the debugger it appears the following line is not understood by the browser :
SCRIPT10006: Expected )

On the line 2 of utils.js
function eventListener(method, elements, events, fn, options = {})

What is the expected behavior?

To fix this issue, I think we have to add the following babel plugin into the transpilation flow : babel-plugin-transform-parameters
To allow spread parameters and default value.

There’s also no way to polyfill it by using es6 bundle.

Your environment:

Version (see Pickr.version): 1.6.0
Used bundle (es5 or normal one): es5 (normal transpiled by babel seems to broke too)
Browser-version:  IE11 
Operating-system:  Windows

[simonwep]

Okay, apparently It worked in the past with IE but I really don't want to change anything to make it work in such a browser (I don't even have access to IE11 anymore...). I've added a note to the README that IE is not (officially) supported.

I'm sorry that poly-filling does not work in your case, I've added the parameter-transform plugin to the ES5 build chain, you can try out the master-version of pickr.es5.min.js :)

[Clebiez]

Hey @simonwep thank you for your fast answer.
Your fix seems to fix the first issue but also doesn't work.The pickr.es5.min.js seems to have "const" var. That is not ES5. I think es5 transpilation isn't correctly applied anymore (maybe due to missing of babel preset env in the .babelrc).

I can open a PR next week to fix this, obviously without rewriting your code but just by bundling specific babel plugins to the es5 and test on old browsers.

[simonwep]

Hi @Clebiez, the .babelrc is just for development. The bundles file contains all production-related configurations :)

targets in the es5 version is set to > 1.5%, not ie < 11, maybe because IE11 usage is below 1.5% (it's around 1.4%) and what's interesting is that, according to caniuse, Internet Explorer does support const 🤔

A PR is welcome :)

[Clebiez]

const var that I see in the bundled es5 file is effectively in for loop

Not supported in for-in and for-of loops

[simonwep]

I've update the bundle here, there's no let or const left, but I doubt that it'll work from a visual perspective 😅
Could you try the most recent bundle?

[davewallace]

Would really like to see this land, we're looking for a drop-in colour picker for IE11 only.

[Clebiez]

Sorry for the delay.

After some tests on ie11 on the master branche, it seems to be fixed. The es5 bundle works well.

Thank you for this fix !

[simonwep]

This has been resolved.