3.2 Beta issue: router link effect is being run before the route component is unmounted

[AlexandreBonaventure]

Version

3.2.0-beta.1

Reproduction link

https://github.com/AlexandreBonaventure/vue3.2-bug
https://codesandbox.io/s/funny-monad-3sgle

Steps to reproduce

Click on 'Go to Route A' then on 'Go to Route B' and observe the error thrown in the console

What is expected?

It should not throw any error and switch route correctly (works with vue<3.2)

What is actually happening?

Error

[posva]

Trying to boil it down without Vue Router by simulating the injected $route but still haven't found it.

A much simpler repro is without nested routes, nor redirects:

import { h } from '@vue/runtime-core'
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'

const routes: RouteRecordRaw[] = [
  {
    name: 'a',
    path: '/a/:id',
    component: () => import('./ARoute.vue'),
  },
  {
    name: 'b',
    path: '/b',
    component: { render: () => h('div', 'B content') },
  },
]

export const router = createRouter({
  history: createWebHistory(),
  routes,
})

ARoute.vue

<template>
  <pre>{{ $route.params.id.toUpperCase() }}</pre>
</template>

App.vue

<template>
  <nav class="flex pa4" style="gap: 30px">
    <RouterLink :to="{ name: 'a', params: { id: 'test' } }">Go to A</RouterLink>
    <RouterLink :to="{ name: 'b' }">Go to B</RouterLink>
  </nav>
  <RouterView />
</template>

[posva]

Closing in favor of #4149

[yyx990803]

FYI this is not entirely the same as #4149 as it also involves a scheduler bug where computed scheduler jobs are not correctly appended (fixed in d810a1a)

[AlexandreBonaventure]

FYI, I upgraded to 3.2.0-beta-2 and while the repro is now working, our repo that initiated this issue is still failing. Will update soon