useMovingAnimation: Ensure transform is removed when the animation is stopped #59426
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
andrewserong
added
[Type] Bug
|
Size Change: +15 B (0%) Total Size: 1.71 MB
ℹ️ View Unchanged
|
|
Closing in favour of #59482 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What?
🚧 🚧 🚧 🚧 WIP: I'm not sure if this is the right fix as it might clear things out too frequently 🚧 🚧 🚧 🚧
Fix a subtle bug with
useMovingAnimationwhere if the cleanup on theuseEffectfires before an animation has finished, then the element can be stuck with a staletransformvalue.Why?
WIth the list view open on a post with enough blocks that the list view gets a scrollbar, if you click somewhere within the editor canvas and press ENTER rapidly to create new paragraph blocks, the newly created blocks can result in the animation not finishing on previously added blocks. The result is that the list view can get "stuck" in a state where some of the list view items are in the wrong position vertically.
How?
useEffect's cleanup function, explicitly settransformtonullto clean up any stray styles left over there.Testing Instructions
trunk(or WP 6.5 Beta 3) notice that there'll be at least one paragraph block in the wrong position vertically, overlapping over list view items.Testing Instructions for Keyboard
Screenshots or screencast
This is the issue, that 🤞 shouldn't be possible to encounter if this PR works correctly: