Fixing Promise race condition
#2220
Conversation
| @@ -181,7 +183,7 @@ export const AnimatePresence: React.FunctionComponent< | |||
| const insertionIndex = presentKeys.indexOf(key) | |||
|
|
|||
| let exitingComponent = component | |||
| if (!exitingComponent) { | |||
There was a problem hiding this comment.
This file is just Prettier
| @@ -65,7 +65,6 @@ export function animateValue<V = number>({ | |||
| * WAAPI-compatible behaviour. | |||
| */ | |||
| const updateFinishedPromise = () => { | |||
| resolveFinishedPromise && resolveFinishedPromise() | |||
There was a problem hiding this comment.
The comment above needs to be updated as well.
| @@ -280,7 +280,7 @@ export function animateValue<V = number>({ | |||
| playState = "finished" | |||
| onComplete && onComplete() | |||
| stopAnimationDriver() | |||
| updateFinishedPromise() | |||
| resolveFinishedPromise() | |||
There was a problem hiding this comment.
Could you elaborate a little more on the race condition? Why do we stop updating the finished promise in finish()?
There was a problem hiding this comment.
For reasons slightly beyond my comprehension, but at least related to adding queueMicrotasks (which is when Promises are resolved), swapping to a new Promise as soon as we resolve the old one messes with Promise.all - seemingly at random. As noted in Onne's linked ticket, even adding a console.log can affect timings in a way that more consistently fixes the observed bug. So instead we swap to a new Promise later - if and when we start a new animation.
There was a problem hiding this comment.
swapping to a new Promise as soon as we resolve the old one messes with Promise.all
Would it have the same impact when cancel() is called?
There was a problem hiding this comment.
I haven't see a bug related to this but it's added there because it's been removed from updateFinishedPromise()
|
i still have issues with exiting components in quick succession getting stuck, and never getting to the proper final component, unless i comment out all |
Fixes #2172
Fixes https://github.com/framer/company/issues/27486