[vue-compat] globalProperty with function as value is always bound to instance proxy

[Fiona-SUN]

Version

3.2.4

Reproduction link

https://github.com/Fiona-SUN/vue3-minimal-reproduction

Steps to reproduce

1. update vue to 3.2.4, install @vue/compat of the same version
2. install UI Components Vant 3.2.0
3. Global Register Toast (eg: https://youzan.github.io/vant/v3/#/en-US/quickstart#cdn)
4. use this.$toast.loading in .vue file

What is expected?

The project should run on Vue 3 with Vant.

What is actually happening?

Uncaught(in promise) TypeError: this.$toast.loading is not a function.project broken

---

PublicInstanceProxyHandlers function use Function.prototype.bind() cause Toast lost some properties.
if there have any other methos to resolve the problem instead of Function.prototype.bind().

[posva]

Please report the bug in Vant's repository or provide a repro without Vant

[LinusBorg]

I felt like looking into this even though the repo wasn't really minimal with the added dependency.

It's an edge-case issue with the compat behaviour for app.config.globalProperties:

https://github.com/vuejs/vue-next/blob/4adc5042f92c384d9aec2d19e05c8bc2c74b2a93/packages/runtime-core/src/componentPublicInstance.ts#L359

• in plain Vue 3, whatever we provide down, we leave untouched
• in @vue/compat, if the value of a globalProperty is a function, we bind it to the instance proxy, in order to mimic the bound behavior of Vue.prototype.someGlobalProperty = function () { ... }

The repo is running in compat MODE: 3 - maybe we should disable this behaviour then? or provide a separate feature flag?

We should discuss it

[Fiona-SUN]

Thanks for helping me to explain this problem clearer.

I think that globalProperty with function as value should be a common approach in dependency libraries.such as ElementUI ,Vant and so on.
Now most of us would like to migrate our project from Vue2 to Vue3(Migration Build)，but the dependency package can not supported fully which makes me confused.Losts of code need to be rewrited.I don't think this is a good performance in version migration.

(Forgive me for my poor English expression skills~

[smileqwe]

I think this behavior should be fixed, because the official versions of vue2 and vue3 do not have this problem, which will lead to differences in the perception of migrated users

[LinusBorg]

It is a bug, but it's an edge case, really. it only affects you if you pass a function that also has additional properties on it (which is not something people do quite often).

A plain function without additional properties on it will work just fine.

[Fiona-SUN]

@LinusBorg Thanks for you helping!

I agree with this. Indeedly, a function has additional properties should be function extension. - but it is undeniable that convenient methods are more popular with people.