Skip to content

Conversation

@thePunderWoman
Copy link
Contributor

@thePunderWoman thePunderWoman commented Aug 7, 2025

In the case that a leave animation is running and someone toggles an @if, a new node would be inserted. For a brief moment, there may be two of the same nodes visible at once. While this is expected with native CSS, it's not ideal. Instead, we retain a reference to the leaving element and can remove that node when the new node is entering.

fixes: #63020

openclosed

for loop revisited

@thePunderWoman thePunderWoman added action: review The PR is still awaiting reviews from at least one requested reviewer area: core Issues related to the framework runtime target: minor This PR is targeted for the next minor release labels Aug 7, 2025
@ngbot ngbot bot added this to the Backlog milestone Aug 7, 2025
@thePunderWoman thePunderWoman force-pushed the animation-remove branch 2 times, most recently from 4d04ff0 to a374dac Compare August 7, 2025 10:16
@thePunderWoman thePunderWoman requested a review from crisbeto August 7, 2025 10:36
@thePunderWoman thePunderWoman changed the title fix(core): prevents duplicate nodes when @if toggles with leave animations fix(core): prevents duplicate nodes when @if toggles or @for adds and removes with leave animations Aug 7, 2025
…mations

In the case that a leave animation is running and someone toggles an `@if`, a new node would be inserted. For a brief moment, there may be two of the same nodes visible at once. While this is expected with native CSS, it's not ideal. Instead, we retain a reference to the leaving element and can remove that node when the new node is entering.

fixes: angular#63020
@thePunderWoman thePunderWoman added action: merge The PR is ready for merge by the caretaker and removed action: review The PR is still awaiting reviews from at least one requested reviewer labels Aug 8, 2025
@atscott
Copy link
Contributor

atscott commented Aug 8, 2025

This PR was merged into the repository by commit 6a11846.

The changes were merged into the following branches: main

@angular-automatic-lock-bot
Copy link

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 Sep 8, 2025
@thePunderWoman thePunderWoman deleted the animation-remove branch September 12, 2025 16:38
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: minor This PR is targeted for the next minor release

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Two elements appear when leave animation is running and @if is toggled true

4 participants