search

swup / js-plugin

A swup plugin for managing animations in JS  🎸
https://swup.js.org/plugins/js-plugin
MIT License
23 stars 5 forks source link

Swup JS Plugin with GSAP 3 does not fire next() in onComplete #2

Closed currenthaus closed 4 years ago

currenthaus commented 4 years ago

The onComplete callback with the new GSAP 3 does not work as expected with Swup page transitions. It does not fire the "next" promise function in my tests.

In a simple fade transition, the fade begins (fade out), but onComplete, no callback fired.

The last event fired is swup:pageRetrievedFromCache (I am using preload plugin as well)

I have tried keeping the same syntax (TweenMax, TweenLite, TimelineMax, etc.) - since GSAP3 supports old - in addition to trying the new syntax (gsap.timeline, gsap.to, etc.). Both resulted in the same outcome.

When I revert back to TweenMax v.2.1.3, all works as expected.

quentin-f451 commented 4 years ago

Same problem here

dev-clarus commented 4 years ago

Hi!I have the same problem too with GSAP3. "in" work, "out" has a problem

dev-clarus commented 4 years ago

my code here

out: (next) => { gsap.to('.paragrafo_animation_hero h1', { opacity: 0, duration: 1, y: 50, ease: 'Power2.easeInOut', onComplete: next }); }

mikehwagz commented 4 years ago

This should be fixed in version 3.0.2 of gsap. Learn more about the bug here!

currenthaus commented 4 years ago

@mikehwagz Thanks for this. Super interesting thread. I can confirm it is now working with all GSAP syntax (gsap.to, TweenMax.to, etc.)

At the time of writing, GSAP is v.3.0.4