augmenting $route on ComponentCustomProperties

[danielroe]

Reproduction

https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAbzgcwKYwMIFcpVQOxgEl8BnGAQ3wGNU4BfOAMyghDgHIA3LVDgKH5MsNGMAj44wUgDkIMAIL4AngAowrMAC445KMHzIAlInqC0mHHkIlyVWqqMBCAHQUwYDBJioAHjBdqCSZgZBdkABsIACMKCIAFTVRYYFRSFwASViwfF2EIhIoYAAt+AHoyuAABGFIAWj8wVGoYBtxoFHRsXAJiMkoaVEdXd09vPwCg-BCwyJi4xIgmlLTM7J9+aTlFFVULbus+u0Hhtw8vQgnA4NDwqNiEpJX0rIgc1CN+IA

Steps to reproduce the bug

See that getCurrentInstance()!.appContext.config.globalProperties.$route is typed as any.

Expected behavior

This type should be augmented.

Actual behavior

It is not.

Additional information

The reason this is occurring is that the type getCurrentInstance()!.appContext.config.globalProperties returns is based on the ComponentCustomProperties interface exposed from @vue/runtime-core, not the version exposed from vue. So augmenting vue's interface does not affect the type returned from getCurrentInstance.

This means that the documentation on https://vuejs.org/api/utility-types.html#componentcustomproperties is probably incorrect. (Or we need to modify the code in @vue/runtime-core to import an interface from vue.

resolves nuxt/nuxt#28373

[posva]

Closing for the moment as discussed with Daniel, the repro is missing importing from vue-router and that fixes it:

import { getCurrentInstance } from 'vue'
import {} from 'vue-router'

function isNotAny(prop: string) {}

getCurrentInstance()!.appContext.config.globalProperties.$route.fullPath
// @ts-expect-error getCurrentInstance()!.appContext.config.globalProperties.$route
isNotAny(getCurrentInstance()!.appContext.config.globalProperties.$route)```