Transition enter-cancelled not called on asynchronous rendering

[GarreltMock]

Vue version

3.5.10

Link to minimal reproduction

https://play.vuejs.org/#eNqNVUtv2zAM/iuCL0mwxs7Q9ZIlRbehh23AOrTFdjEwqA6dqpUlQ5LdFEH++yjJz0B9+GSRHynyEx/76EtZxnUF0TJa6Uyx0hANpirPU8GKUipD9kRBTg4kV7IgE4ROOtWtlNywslHFSXO2/gYg0KZH4KFRpyKTAlX6Xj6Rtb1kmlOuYZYKjOCWFSArM53OyPqcTC0orimvAKFGVTBD2CrxEWOseDBQlJwawBMhqw2rST1n+TqNrG0aOTEq2piTTmDj86dVgmb4t0o6Z9FJNMjqmCXCqdjiFUa7CzrGKg3tPS1xcdILY6N7fvbkiZrs/jLPITMnAbJbovaE6T9MszsOiFgPLpkiGQMnDWnWSnKIudxO06izXZI0Ih96X57WN/hEboyiQjPDJCqtwH6CFoDp07IEqtKoVzSS7nxxB7lUMAdhQKHFMLbJUDeZDd1cBPEhIM1RFnY/UIW8zzMqMuAcNsF7evWRcRM1B1pbDkIZOd2RWRAfAvqwg/CBKuT95YyO1L1x88juoQet0xVJ1z/t15Y306Ru62o/qtDDwGXTV/6/L6Rxq7mq0+YZjXUmS9igJPaF5F9vTjPDaiB776n3sySypBkzz+RssSg0AarB/35OBcYx9uJ6q/HR2C3JwiOxBWwAeDM2vsEwRM628YOWAlvf2VhGi5JxUFelvRs7HzP33rATOJdPP5zMTqmTVp7dQ/YYkD/onZWl0W8FGlSNRHc6Q9UWjFdf3vyCHf53ykJuKvssryivAR++cg3rYF8rscGwBzgX7Xc3hpjY3urLnQGktEnKBmqRB4dPI5xG315JvQ/3NP7k7JBRZHE09pDFV9ZKO+n6KvJ7wQ18q4ads80rgZUgxWgEtpEoHMxKtCf74ah2/hh3Tz3tCvYObYEKNy0HePsdjUcMpLHqYZ6XI7gX2dRdCbX77r2LAzPE1Zc9hvftm4tlglXcr4tR3oGV4RZtj+jWb5KQv1fXP2+WXTjNRgnBX94bo9ZGLv7VoGxxIRen8Vn8cREd/gNjPtMc

Steps to reproduce

Render two components asynchronously after a short timeout. The first component adds a tooltip with a transition. It is visible at first. The second component then sets the visibility of the tooltip (via composable) to false. If this action is not done with a nextTick the tooltip is still visible.

In the reproduction link the bug happens immediately, since it is caused by the transition. The tooltip should not be visible at all.

The wrong behaviour can be viewed in the console.log. The enter is called after leave, although it should not be visible. To view the correct behaviour you can comment out the according lines in Test.vue like this:

// DOES NOT WORK
//setVisibility(false)

// WORKS
nextTick(() => setVisibility(false))

What is expected?

It is expected that the tooltip is not visible and the order of events for the transitions should look like this:

isVisible: true
"before-enter"
"enter"
isVisible: false
"enter-cancelled"
"before-leave"
"leave"
"after-leave"

What is actually happening?

The tooltip is visible and the transition events look like this:

isVisible: true
"before-enter"
isVisible: false
"before-leave"
"leave"
"enter"
"after-enter"

System Info

No response

Any additional comments?

It is also notable that the template of the tooltip is not reactive anymore. Even though the watchEffect logs isVisible: false, the template still displays true.