fix: keep-alive component data should not be updated

[clarkdo]

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

Fix #5166

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-io]

Codecov Report

Merging #5188 into dev will decrease coverage by 1.47%.
The diff coverage is n/a.

@@            Coverage Diff             @@
##              dev    #5188      +/-   ##
==========================================
- Coverage   96.52%   95.05%   -1.48%     
==========================================
  Files          72       72              
  Lines        2447     2447              
  Branches      620      620              
==========================================
- Hits         2362     2326      -36     
- Misses         70      100      +30     
- Partials       15       21       +6

Impacted Files	Coverage Δ
packages/webpack/src/plugins/vue/cors.js	0% <0%> (-90%)	⬇️
packages/webpack/src/config/client.js	83.33% <0%> (-12.97%)	⬇️
packages/webpack/src/plugins/vue/server.js	79.31% <0%> (-6.9%)	⬇️
packages/webpack/src/utils/postcss.js	85.71% <0%> (-6.13%)	⬇️
packages/webpack/src/utils/style-loader.js	88.23% <0%> (-5.89%)	⬇️
packages/webpack/src/plugins/vue/client.js	88.57% <0%> (-5.72%)	⬇️
packages/webpack/src/utils/perf-loader.js	94.73% <0%> (-5.27%)	⬇️
packages/webpack/src/config/base.js	90.9% <0%> (-4.55%)	⬇️
packages/webpack/src/builder.js	91.48% <0%> (-3.2%)	⬇️
packages/utils/src/route.js	97.58% <0%> (-2.42%)	⬇️
... and 1 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 2cbddeb...85ec562. Read the comment docs.

[pi0]

Just to be sure, is the default value of keepAlive, false by default? If it is true, isn't this a minor breaking change?

[clarkdo]

The default value is undefined, it's just a flag in Vue for keepAlive cached component.

I don't think it's a breaking change, it should be a bug because component under keep-alive should be cached and never reload data as Vue is doing.

[ghost]

Just wondering, shouldn't it be data.props.keepAlive instead of data.keepAlive? Because in bunch of files (packages/vue-app/template/components/nuxt.js, etc), keepAlive property is being wrapped into props object.

I ran into an issue when component is still trying to update its data() even though it has keep-alived enabled.
Changing this line to data.props.keepAlive solved problem for me.

PS: Nuxt v2.15.2 (seems like nothing have been changed with keep-alived behaviour ever since this commit)

[clarkdo]

keepAlive here is checking vue keep-alive component which will add keepAlive to vnode.data https://github.com/vuejs/vue/blob/b51430f598b354ed60851bb62885539bd25de3d8/src/core/components/keep-alive.js#L120

[ghost]

Thanks for your reply.

Sorry, but what should be the keep-alive component in here? Because debugger says that instance is a page component. Also, instance.$vnode.data doesn't have keepAlive property, but it does have props.keepAlive.

Screenshot:

[clarkdo]

I think the component in your screenshot is NuxtChild which has keep-alive prop for enabling keepAlive on it.

https://nuxtjs.org/docs/2.x/features/nuxt-components#keep-alive

[ghost]

You right, it is NuxtChild component.
I thought it should work the same way for any components, but seems like it is not the case.
I'll try to investigate it a little bit further and maybe come back with new issue and/or PR.
Thanks for your comments 👍

[clarkdo]

Thanks, bro.