gooey-react CSS keyframes are not applied on documentation website

Hi, I was viewing the docs site on Safari 15.5 (17613.2.7.1.8) on macOS 12.4 (21F79), and all effects were not working as expected.

Here's a screen capture

https://user-images.githubusercontent.com/8225666/180743317-c5d35c39-bf5f-45a4-83ee-131634f1f454.mov

Jul 25 '22 09:07 SevenOutman

After doing some research it seems the library itself is still working as expected, but Safari 15.5 is not applying the CSS animation keyframes on the documentation site anymore. I'll try to find out the cause.

Thanks for letting me know!

Jul 31 '22 10:07 luukdv

Hey luukdv, Great work with the library! Do you have any updates on why Safari 15.5 is not applying the CSS Animation Keyframes?

Cheers!

Sep 01 '22 00:09 dpsoccerdude101

Thanks!

I'm quite busy at the moment so didn't have a chance yet unfortunately. If anyone wants to take a look instead that would be appreciated as well of course. The documentation website is a simple Gatsby app, and the question is why these aren't applied anymore. Maybe Safari doesn't register keyframes anymore that only have their end state defined? That would be a severe regression in 15.5 though…

Sep 04 '22 17:09 luukdv

Hey @luukdv, It looks like you were right; it appears as if safari-ios does not register keyframes that only have their end-state defined.

Dec 19 '22 18:12 dpsoccerdude101

Ouch. Thanks for confirming! I've added a workaround: https://github.com/luukdv/gooey-react/pull/6/files#diff-4dde236d1a1b6f7a24be281ce9e8212368612d66a631fa592bfe18653f57c601

Dec 20 '22 13:12 luukdv