Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

[BUG] - Multiple CE instances style breaking when 1st CE removed from the DOM #113

Closed
3 tasks done
OBe95 opened this issue Nov 21, 2023 · 7 comments · Fixed by #114
Closed
3 tasks done

[BUG] - Multiple CE instances style breaking when 1st CE removed from the DOM #113

OBe95 opened this issue Nov 21, 2023 · 7 comments · Fixed by #114
Labels
🐞 bug Something isn't working

Comments

@OBe95
Copy link
Contributor

OBe95 commented Nov 21, 2023

Describe the bug

Removing the 1st CE instance of a v-for, leads to style being completely removed from the DOM even though there are still other CEs relying on it

Reproduction

https://play.vuejs.org/#eNqNVE1v2zAM/SucdsgGtBGw3gLX2Nb10B22oguwQ92D5zCJWscyJDlLEPi/j5ItRc6cbgWK2HyPfPwyD+xTXU+3DbIZSwxu6jI3mGYV0F+y/pA+YK3koimMkBVog7VOOJl7QlP2T+6tFOmNrPdg1giFrAxWBuQS5mv8iWUhN2h1rMWshQZS2q+UbKpFwslzGOc+Jy0QBkTlwiUitXxe4GVe11yrglPAWlakoflQIeEijUIm3GWZ8Kg6dsGMphSXYjV91rKi4g+WnTEbVZSovte2Yp2xGTjEYnlZyt9fnc2oBi+8vVhj8TJif9Y7a8vYvUKNaosZC5jJ1QpNB9/++IY7eg7ghjpeEvsV8AG1LBubY0f7TH2ktCOey/aOeqSMqFZzfbujgWhflE3UMlvHzxj17eaV0o/pXk2vnF9WtdTFYeftDulCidqARtPUaaaySrgU4AAKc1qjLUILSyU3MCGPScToA93RnHrClEc2KxDTv8ii2dD4c5vtHQ0zOAl60dyaBpzTAHMpS+rMGdcePXW6LaTe025uzrgFPDjafwvTLpNZwzU8WhNQc90PgPWe/V3PhcfXmC8olRlMBpxJIPQf2ymhs3saTXpMNurCiGCPjkn1ENx0ln/IDPo2IhTwMakAjos9Ddu8ENreClxQq/3OvTsM+9t/qb56/xqEOgO0723YhHdL7dbZGY6nxKWRLMQWtpdLqa4zZqdsz5abdsZg9oL73jzt681Y70iu8dZvL8WSqKGAx9jpKfIiP58CvLUNjhDCwmmEmdBe29IoHR4HiW7iWOReOT0cXDU+E2jbUU9P87e/bUOV8Yd8rP1XYwyt6ceiFMXL+cJpjm/+pydzuVrR2QyaXXg/I05Dcs8nubP2D1s3Y48=

System Info

No response

Used Package Manager

npm

Validations

@OBe95
Copy link
Contributor Author

OBe95 commented Nov 21, 2023

This seems to be linked to the optimisation done in this PR to avoid appending the same style multiple time

@baiwusanyu-c
Copy link
Member

Hello, based on the information you provided to reproduce the problem, I am unable to further troubleshoot the problem. The reasons are as follows.

  1. I don’t know the code content of WelcomeItem.vue, I can only judge that it contains three slots
  2. I can’t determine the code content of DocumentationIcon.vue, ToolingIcon.vue, and EcosystemIcon.vue, nor do I know what styles they contain.
    This prevents me from accurately reproducing the problem using TheWelcome.vue
    It is also worth mentioning that the code in unplugin-vue-ce currently lags behind the content of 7942, so your PR content may not be available. Are you sure there is still a problem in 7942?

@baiwusanyu-c
Copy link
Member

I need you to provide more information to locate the problem, which at least includes the smallest relevant component code content and interactive steps that can reproduce the problem.
With this information, I can determine whether there is this problem in the latest code of 7492 (I am going to add the latest content to unplugin-vue-ce)

@OBe95
Copy link
Contributor Author

OBe95 commented Nov 24, 2023

@baiwusanyu-c here is a reproduction env, you can toggle the first child and see the impact on the others

The issue comes from the fact that the optimisation of avoiding adding multiple times the same style attaches the style-content to the 1st rendered element (without keeping track of how many elements uses the same style) and when unmounting that element it removes the style (the PR suggestion adds the count tracking to avoid deleting the styles unless there are no other elements depending on it)

I am not sure what you're referring to with 7492

@baiwusanyu-c
Copy link
Member

7492 refers to vuejs/core#7942
The latest code in this PR will no longer delete styles except in hot updates.

@OBe95
Copy link
Contributor Author

OBe95 commented Nov 24, 2023

Then I assume it will still happen in dev mode (didn't check yet)
Out of curiosity why you no longer consider deleting styles ?

@baiwusanyu-c
Copy link
Member

The design that does not delete style is discussed with a member of the VUE team, because we noticed that the existing implementation of ordinary components will not delete the style

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
🐞 bug Something isn't working
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants