Vue 3 Composition API unit test : $route is undefined in onMounted() hook

Solution for Vue 3 Composition API unit test : $route is undefined in onMounted() hook
is Given Below:

I have a onMounted() hook in my component setup() function which access the $route.params property, but when I mock the $route object in my test, $route is undefined in the onMounted() hook, hence throwing an error. Here’s the code

Component.vue :

<template>
  <div>{{ this.$route.params.id }}</div>
</template>

<script lang="ts">
import {defineComponent, onMounted} from 'vue'
import {useRoute} from "vue-router";

export default defineComponent({
  name: 'Component',
  setup() {
    const route = useRoute()
    onMounted(() => {
      console.log(route.params.id)
    })

    return {}
  }
})
</script>

Component.spec.ts :

import {mount} from "@vue/test-utils";
import Component from "@/views/Bundle/Component.vue";

test('test description', async () => {
  const mockRoute = {
    params: {
      id: 1
    }
  }
  const mockRouter = {
    push: jest.fn()
  }

  const wrapper = mount(Component, {
    global: {
      mocks: {
        $route: mockRoute,
        $router: mockRouter
      }
    }
  })

  await wrapper.find('button').trigger('click')
})

Error thrown:
TypeError: Cannot read property ‘params’ of undefined

I’m using version 2.0.0-rc.12 of vue-test-utils.

Any help would be much appreciated