fix(vue-app): use mixin to provide this.$nuxt

[danielroe]

Types of changes

• Bug fix (a non-breaking change which fixes an issue)
• New feature (a non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Description

avoids prototype pollution on the Vue prototype

closes #7696

Checklist:

• My change requires a change to the documentation.
• I have updated the documentation accordingly. (PR: #)
• I have added tests to cover my changes (if not applicable, please state why)
• All new and existing tests are passing.

[codecov-commenter]

Codecov Report

Merging #8068 into dev will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##              dev    #8068   +/-   ##
=======================================
  Coverage   68.98%   68.98%           
=======================================
  Files          91       91           
  Lines        3847     3847           
  Branches     1047     1047           
=======================================
  Hits         2654     2654           
  Misses        969      969           
  Partials      224      224           

Flag	Coverage Δ
#unittests	68.98% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 45b7838...9944c5b. Read the comment docs.

[Damianos02]

http://192.168.100.29

[pi0]

@clarkdo @danielroe Can we add a SSR test to ensure this fix works?

[danielroe]

Are we okay with prototype pollution outside of a component instance? (I'm also aware that injected objects currently also appear to be shared across requests but I haven't yet verified that...)

[clarkdo]

Are we okay with prototype pollution outside of a component instance?

Actually I don't think is a prototype pollution as it's a very normal way in Vue plugin, the issue is that different ssr requests are sharing same Vue reference.

[clarkdo]

Hi @danielroe , have you verified this fix in your project ? Are we OK to merge ?

[danielroe]

@clarkdo Looks good to me - apologies for the delay. (Didn't realise you were waiting on me 🤦)

[clarkdo]

@danielroe No worries, thanks for the confirmation, I'll merge it now.

[pi0]

@clarkdo @danielroe I think we shouldn't merge this PR. Mixin method is probably replaceable with simple getter and SSR tests aren't added

[clarkdo]

SSR tests aren't added

I'll revert the pr.

Mixin method is probably replaceable with simple getter

Correct me if I misunderstood, I think we can't use getter like below, because it will still get new reference.

get nuxt() {
  return Vue.prototype.nuxt
}

[danielroe]

Correct me if I misunderstood, I think we can't use getter like below, because it will still get new reference.

get nuxt() {
  return Vue.prototype.nuxt
}

This is correct - it results in the same original issue if we are using getters in the way that the plugins do.

[clarkdo]

Reverted and new pr is here #8132

[pi0]

@danielroe Not directly returning same reference 🙈 But we can pass and read same reference from instance options (similar to plugins inject) this way we don't need a new mixin to be called for every component :)

[clarkdo]

@pi0 What about adding $root.... to Vue.prototyp.nuxt getter ?