Destroy hook is called before transition finishes

[antonisntoulis]

Checks

• Not a duplicate.
• Not a question, feature request, or anything other than a bug report directly related to Vue Splide. Use Discussions for these topics: https://github.com/Splidejs/splide/discussions

Version

0.6.12

Description

Vue 3 built-in unMounted/beforeUnmount hooks get called before transitions have ended and it's sadly the expected behaviour.

Splide calls the destroy() method on its instance when the vue beforeUnmount hook gets called.

When we have a transition on our pages we can see the splide get destroyed(slides suddently lose styling ,positioning etc) before the page has finished transitioning and this is not ideal at all.

Reproduction Link

No response

Steps to Reproduce

1. Create a vue app with router
2. Have at least two pages with transitions
3. Put a splide on one of the pages
4. Navigate from the page with the splide to another one
   ...

Expected Behaviour

Splide should wait for the transitions to end before destroying.

[doutatsu]

I've gone ahead and made a simple PR to address this issue, as I have the same issue. Providing an option to delay destroy action allows us to wait for the transition to end before destroying the carousel. Hope @NaotoshiFujita takes a look 🖖🏻

[ThornWalli]

@NaotoshiFujita What is the current status here?

Any kind of Vue transition causes problems...