react-fluid-animation icon indicating copy to clipboard operation
react-fluid-animation copied to clipboard

WebGL 2.0 support on IOS Safari

Open jamiedevivoo opened this issue 4 years ago • 1 comments

On IOS Safari a bug in this component/package causes a fatal error and crash.

Steps for repeating:

  • Open the demo on the readme on IOS Safari.

Only seems to be this browser+device combination, both Chrome on IOS and Safari on Mac is fine.

This happens in the demo provided in the readme too: https://transitive-bullshit.github.io/react-fluid-animation/

I know the repo is quite old and may not be maintained anymore, but posting this issue for others to see too.

I've attached a screenshot of the console log if it helps anyone diagnose the issue more, I'll probably look for another implementation of the fluid animation.

First time opening a new issue, so please let me know if any more information is needed.

Image 17-05-2021 at 19 17

Image 17-05-2021 at 19 22

jamiedevivoo avatar May 17 '21 18:05 jamiedevivoo

After a bit of debugging, this appears to be an issue with WebGL 2.0. Specifically, only when WebGL 2.0 is enabled in Experimental Features in IOS Settings > Safari.

Online documentation appears to indicate the WebGL 2.0 option here, and WebGL 2.0 support is disabled by default in Safari IOS so this shouldn't cause an issue for users out of the box. However, I don't remember enabling it myself and it was working last week, so I'm not sure what changed... either way, disabling it again fixes the issue.

However, looks like this will be enabled by default in the next update so worth looking into now. I'd welcome anyone else's input on this issue.

Maybe it was a silly idea but I played around with getContext and forcing it to get the WebGL 1.0 context, even with WebGL 2.0 enabled, but this didn't fix the issue.

jamiedevivoo avatar May 18 '21 22:05 jamiedevivoo