Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HMR adds changes twice when using teleport #3302

Closed
martinszeltins opened this issue Feb 25, 2021 · 2 comments · Fixed by #3311
Closed

HMR adds changes twice when using teleport #3302

martinszeltins opened this issue Feb 25, 2021 · 2 comments · Fixed by #3311
Labels
🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. 🐞 bug Something isn't working

Comments

@martinszeltins
Copy link

Version

3.0.6

Reproduction link

https://github.com/martinszeltins/vue-hmr-teleport-duplicates

Steps to reproduce

https://github.com/martinszeltins/vue-hmr-teleport-duplicates

  1. Clone the repo, install dependencies and run npm run dev
  2. Open the app in the browser and click on "Show menu" button. Menu will open.
  3. Now go to App.vue and after <div>3</div> add one more item <div>4</div>
  4. Save the file and look at the browser - you will see that hmr added <div>4</div> twice!

What is expected?

The expected result after adding a new item would be this:

<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>

What is actually happening?

Instead HMR has added 4 twice!

<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>4</div>

I'm using Vite 2.0.3 (latest)

@HcySunYang HcySunYang added 🐞 bug Something isn't working 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. and removed 🐞 bug Something isn't working 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. labels Feb 25, 2021
@edison1105
Copy link
Member

edison1105 commented Feb 25, 2021

same issue in latest @vue/cli.

@HcySunYang HcySunYang added 🐞 bug Something isn't working 🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. labels Feb 26, 2021
@HcySunYang
Copy link
Member

HcySunYang commented Feb 26, 2021

The issue is a bit like 376883d, the difference is that this issue brings duplicate mounting instead of unmounting. When performing HMR updates, we deliberately fall back to the non-optimized mode, like this https://github.com/vuejs/vue-next/blob/012dc5a30366d3325c464c3b62da123147788237/packages/runtime-core/src/renderer.ts#L893-L898.
So we should check it when the Teleport component performs updating

Edit: I adjusted the implementation to make it more consistent

@github-actions github-actions bot locked and limited conversation to collaborators Oct 23, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
🔨 p3-minor-bug Priority 3: this fixes a bug, but is an edge case that only affects very specific usage. 🐞 bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants