search

nolanlawson / emoji-picker-element

A lightweight emoji picker for the modern web
https://nolanlawson.github.io/emoji-picker-element/
Apache License 2.0
1.47k stars 83 forks source link

Replace optional chaining for `ensure_array_like_shim` #379

Closed xavier-villelegier closed 10 months ago

xavier-villelegier commented 10 months ago

Hey hey !

In the v1.19, a new function was introduced (ensure_array_like_shim)

But this function isn't transpiled in the final bundle. The optional chaining operator ?. was introduced in Safari 13.4, which is not that old, so this triggers errors on a few browsers .

I'm not very familiar with rollup so maybe there are ways to transpile the code injected via the inject plugin, which would be more robust ?

nolanlawson commented 10 months ago

Great catch! I totally missed this when I added Svelte v4 support.

Luckily I am already including my own version of the Svelte v4 function (for Svelte v3 compat), so we can trivially fix this: https://github.com/nolanlawson/emoji-picker-element/pull/380

nolanlawson commented 10 months ago

Hm, well it turns out that even if we fix the ?., there is another syntax error in old Safari:

Unexpexted token '='. Expected an opening '(' before a method's parameter list.

This seems to be caused by this class using class properties in Svelte v4, which used to not use class properties in v3.

I think at this point we would have to transpile the whole thing into JS that is compatible with old Safari.

nolanlawson commented 10 months ago

OK, it looks like the class props were the last thing breaking old Safari. Whew! Fun times with old browsers. :sweat_smile:

nolanlawson commented 10 months ago

BTW, this will only work if you are importing directly from emoji-picker-element, not from emoji-picker-element/svelte.js.

In the svelte.js build, the SvelteComponent will be imported directly from the svelte package, so if you are using Svelte v4, then you already cannot support Safari <13.4 unless you transpile Svelte itself. I have no control over this in emoji-picker-element.

nolanlawson commented 10 months ago

Oh sorry! I didn't realize this was a pull request rather than an issue. I totally would have pulled in your changes if I had realized, since I ended up doing the same thing.

In any case though, this is only a partial solution as I mentioned above, so I had to do a bunch of other stuff as well. Thanks for the fix! :bow:

xavier-villelegier commented 10 months ago

Sure, no worries @nolanlawson ! Thanks for the fix 🙏