Template behaves differently when redefining $data

[TurtleKwitty]

Environment

• Operating System: Linux
• Node Version: v21.7.1
• Nuxt Version: 3.10.3
• CLI Version: 3.10.1
• Nitro Version: 2.9.3
• Package Manager: npm@10.5.0
• Builder: -
• User Config: devtools
• Runtime Modules: -
• Build Modules: -

Reproduction

https://github.com/TurtleKwitty/NuxtPluginProvideBug

Describe the bug

There is an unexpected interaction between plugin provided refs and local redefinitions with const {$data} = useNuxtApp()

When using the global object in a template a ref holding undefined or null will return {} and .value is required to make it behave correctly When redefining it locally with const {$data} = useNuxtApp() then it is correctly returned as undefined or null

I will attempt to take a look if I can hunt down the cause of this bugged interaction but do not currently have a PR.

Additional context

No response

Logs

No response

[warflash]

See -> https://github.com/nuxt/nuxt/issues/15709#issuecomment-1397417354

[TurtleKwitty]

See -> #15709 (comment)

Good point on it being a breaking change; it's the second time I've ran into it, but the first time a year ago I hadn't had time to investigate and couldn't find a reference as to why my code was breaking.

I'm thinking at least a reference to this unexpected interaction in the docs and possibly issuing a warning to the user would be a good middle ground to remove the confusion when one runs into this?

[pothuraju-dev]

Already a note is added in plugins docs

I want to elaborate much about this issue in docs with the title Providing reactive(ref/computed) as helpers and showing an example with do ✅ and don't ❌ code snippets.

If this is okay I will do the changes in docs of plugins section.