Skip to content

fix(core): handle shadow DOM encapsulated component with HMR#59597

Closed
crisbeto wants to merge 1 commit intoangular:mainfrom
crisbeto:59588/hmr-shadow-dom
Closed

fix(core): handle shadow DOM encapsulated component with HMR#59597
crisbeto wants to merge 1 commit intoangular:mainfrom
crisbeto:59588/hmr-shadow-dom

Conversation

@crisbeto
Copy link
Copy Markdown
Member

When a component is created with shadow DOM encapsulation, we attach a shadow root to it. When the component is re-created during HMR, it was throwing an error because only one shadow root can be attached to a node at a time.

Since there's no way to detach a shadow root from a node, these changes resolve the issue by making a shallow clone of the element, replacing it and using the clone for any future updates.

Fixes #59588.

@crisbeto crisbeto added action: review The PR is still awaiting reviews from at least one requested reviewer target: patch This PR is targeted for the next patch release labels Jan 17, 2025
@angular-robot angular-robot bot added the area: core Issues related to the framework runtime label Jan 17, 2025
@ngbot ngbot bot added this to the Backlog milestone Jan 17, 2025
@AndrewKushnir AndrewKushnir removed the action: review The PR is still awaiting reviews from at least one requested reviewer label Jan 17, 2025
@crisbeto crisbeto added the action: merge The PR is ready for merge by the caretaker label Jan 18, 2025
When a component is created with shadow DOM encapsulation, we attach a shadow root to it. When the component is re-created during HMR, it was throwing an error because only one shadow root can be attached to a node at a time.

Since there's no way to detach a shadow root from a node, these changes resolve the issue by making a shallow clone of the element, replacing it and using the clone for any future updates.

Fixes angular#59588.
@crisbeto crisbeto force-pushed the 59588/hmr-shadow-dom branch from 6c5552c to 5e4f478 Compare January 20, 2025 08:02
@pkozlowski-opensource
Copy link
Copy Markdown
Member

This PR was merged into the repository by commit 394a683.

The changes were merged into the following branches: main, 19.1.x

pkozlowski-opensource pushed a commit that referenced this pull request Jan 20, 2025
When a component is created with shadow DOM encapsulation, we attach a shadow root to it. When the component is re-created during HMR, it was throwing an error because only one shadow root can be attached to a node at a time.

Since there's no way to detach a shadow root from a node, these changes resolve the issue by making a shallow clone of the element, replacing it and using the clone for any future updates.

Fixes #59588.

PR Close #59597
PrajaktaB27 pushed a commit to PrajaktaB27/angular that referenced this pull request Feb 7, 2025
…#59597)

When a component is created with shadow DOM encapsulation, we attach a shadow root to it. When the component is re-created during HMR, it was throwing an error because only one shadow root can be attached to a node at a time.

Since there's no way to detach a shadow root from a node, these changes resolve the issue by making a shallow clone of the element, replacing it and using the clone for any future updates.

Fixes angular#59588.

PR Close angular#59597
@angular-automatic-lock-bot
Copy link
Copy Markdown

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Feb 20, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

action: merge The PR is ready for merge by the caretaker area: core Issues related to the framework runtime target: patch This PR is targeted for the next patch release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

HMR Ionic Angular live reload not working (ViewEncapsulation.ShadowDom)

3 participants