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

fix(animations): retain triggers values for moved tracked list items #44578

Conversation

dario-piotrowicz
Copy link
Contributor

@dario-piotrowicz dario-piotrowicz commented Dec 29, 2021

when reordering a list with animations the list items lose their current
triggers values, that is because the reordering of an item is implemented
as follows (note: the following implementation has been added in PR #23534)

  • the item is removed and marked setForRemoval
  • the item is re-inserted, and the setForRemoval is changed to setForMove
  • the player set for animating the removal is destroyed when setForMove is detected

the above steps allow the element not to be animated and to keep its styling but the
triggers values get lost since the removal transition/player has already been initialized,
so this change adds a previousTriggersValues map in the REMOVAL_FLAG field in order to
restore the triggers values if/when the removal turns out to be a move, changing the above steps to:

  • the item is removed and marked setForRemoval and its current triggers values are saved as well
  • the item is re-inserted, and the setForRemoval is changed to setForMove
  • the player set for animating the removal is destroyed when setForMove is detected and the
    trigger values are re-applied in the engine's statesByElement map

resolves #29526

PR Checklist

Please check if your PR fulfills the following requirements:

PR Type

What kind of change does this PR introduce?

  • Bugfix
  • Feature
  • Code style update (formatting, local variables)
  • Refactoring (no functional changes, no api changes)
  • Build related changes
  • CI related changes
  • Documentation content changes
  • angular.io application / infrastructure changes
  • Other... Please describe:

Issue

Issue Number: #29526

Does this PR introduce a breaking change?

  • Yes
  • No

@jessicajaniuk 😄

when reordering a list with animations the list items lose their current
triggers values, that is because the reordering of an item is implemented
as follows (_note:_ the following implementation has been added in PR angular#23534)
 - the item is removed and marked _setForRemoval_
 - the item is re-inserted, and the _setForRemoval_ is changed to _setForMove_
 - the player set for animating the removal is destroyed when _setForMove_ is detected

the above steps allow the element not to be animated and to keep its styling but the
triggers values get lost since the removal transition/player has already been initialized,
so this change adds a _previousTriggersValues_ map in the _REMOVAL_FLAG_ field in order to
restore the triggers values if/when the removal turns out to be a move, changing the above steps to:
 - the item is removed and marked setForRemoval __and its current triggers values are saved as well__
 - the item is re-inserted, and the setForRemoval is changed to setForMove
 - the player set for animating the removal is destroyed when setForMove is detected __and the
   trigger values are re-applied in the engine's statesByElement map__

resolves angular#29526
Copy link
Contributor

@jessicajaniuk jessicajaniuk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM 🍪

This is probably the only way this issue can be resolved given the constraints. Thanks for looking into this, @dario-piotrowicz!

@jessicajaniuk jessicajaniuk added target: patch This PR is targeted for the next patch release action: merge The PR is ready for merge by the caretaker and removed target: patch This PR is targeted for the next patch release labels Jan 7, 2022
@atscott
Copy link
Contributor

atscott commented Jan 7, 2022

This PR was merged into the repository by commit 8ba43a1.

atscott pushed a commit that referenced this pull request Jan 7, 2022
…44578)

when reordering a list with animations the list items lose their current
triggers values, that is because the reordering of an item is implemented
as follows (_note:_ the following implementation has been added in PR #23534)
 - the item is removed and marked _setForRemoval_
 - the item is re-inserted, and the _setForRemoval_ is changed to _setForMove_
 - the player set for animating the removal is destroyed when _setForMove_ is detected

the above steps allow the element not to be animated and to keep its styling but the
triggers values get lost since the removal transition/player has already been initialized,
so this change adds a _previousTriggersValues_ map in the _REMOVAL_FLAG_ field in order to
restore the triggers values if/when the removal turns out to be a move, changing the above steps to:
 - the item is removed and marked setForRemoval __and its current triggers values are saved as well__
 - the item is re-inserted, and the setForRemoval is changed to setForMove
 - the player set for animating the removal is destroyed when setForMove is detected __and the
   trigger values are re-applied in the engine's statesByElement map__

resolves #29526

PR Close #44578
@atscott atscott closed this in 8ba43a1 Jan 7, 2022
@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 Feb 7, 2022
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: animations target: patch This PR is targeted for the next patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Angular animation: :leave animation starts at wrong position
4 participants