Three.js: PropertyMixer unsupported Array methods break Internet Explorer 11

[JordyvanDortmont]

Description of the problem

Thank you @c-morten for implementing additive animations! We hope to use it in the future.

Unfortunately it has broken animation for Internet Explorer 11, because Array.prototype.fill and Array.prototype.copyWithin were used in the PropertyMixer. If this is a deliberate decision to drop support for Internet Explorer 11 without polyfills (in src, for some files in examples you need polyfills anyway), it would be nice to mention this in the migration guides, so updating doesn't unknowingly break Internet Explorer 11 in production.

Three.js version

• [x] Dev
• [x] r116
• [ ] ...

Browser

• [ ] All of them
• [ ] Chrome
• [ ] Firefox
• [x] Internet Explorer

OS

• [ ] All of them
• [x] Windows
• [ ] macOS
• [ ] Linux
• [ ] Android
• [ ] iOS

Hardware Requirements (graphics card, VR Device, ...)

[Mugen87]

There are polyfills for both methods. Would adding these polyfills to polyfills.js solve the problem for IE 11 users?

https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Array/fill
https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Global_Objects/Array/copyWithin

[JordyvanDortmont]

Didn't know about polyfills.js! That would definitely fix the problem for IE 11 users.

[Mugen87]

Okay, so there are three options now:

• Adding the polyfills to the lib.
• Remove the usage of Array.prototype.fill() and Array.prototype.copyWithin() from PropertyMixer.
• Stop IE 11 support and add note to migration guide.

[JordyvanDortmont]

Some of the users of our platform still use IE 11 and we've been trying to nudge them towards more modern browsers with warnings, which helps, but there's still a significant amount of users that persists.

We hope we can drop support next year, so for our platform the third option would not be ideal, although I get that we all have to move on sooner rather than later to reduce all the unnecessary time and effort spent on keeping a legacy browser supported.

[Mugen87]

In any event, sorry for breaking your app in IE11. The core lib still supports this browser and we should have known that the above array methods are not always available.

[JordyvanDortmont]

I really appreciate that! We're deeply grateful for the work you (and all the other contributors) have been doing all those years on three.js. The least we can do is report back, and, if possible, contribute.

[c-morten]

It would be easy enough to replace the calls to fill and copyWithin with a forloop and just use set, which appears to be supported across the board. I can submit a PR with that change.

[mrdoob]

@c-morten

I can submit a PR with that change.

That world be great! 🙏

[donmccurdy]

Are we transpiling ES6 classes? That's another thing likely to break IE11 over the coming months, and requires that either (a) three.js transpiles, or (b) the developer's application transpiles.

[Mugen87]

Are we transpiling ES6 classes?

Yes, the project uses Bublé for this:

https://github.com/mrdoob/three.js/blob/8018d51038ec7ab0c6b537e6c44bfd12da989f72/utils/build/rollup.config.js#L210-L215

[DefinitelyMaybe]

Are we transpiling ES6 classes?

Yes, the project uses Bublé for this [...]

@Mugen87 would it be ok if I jump back into trying work through the class migration? I promise to do more testing before making PR's 🧪 💯 🎉

[c-morten]

Here's the PR with the fix: https://github.com/mrdoob/three.js/pull/19297

[Mugen87]

would it be ok if I jump back into trying work through the class migration?

@DefinitelyMaybe Please don't. IMO, I think it's better when the collaborators handle this topic when the time for this is right.

[DefinitelyMaybe]

I'm reading low-trust and higher-priorities. progress is slow.

Not that I'm saying other things shouldn't have higher priorities and trust of an unknown developer is likely low anyway. More that we've been down this road before and I grow weary of waiting on a couple of whims.

[mrdoob]

@DefinitelyMaybe It's not about "trust of an unknown developer", is about us maintainers not being ready for that change yet.

[DefinitelyMaybe]

well I want to help that process along, what can I do?