Add fallback timeout to runAfterAnimation

07ef5122bbc124ecbf3900aacf77ba6d2cb01b9a

Cohee <18619528+Cohee1207@users.noreply.github.com>

public/scripts/utils.js+7 -7 Viewed

 /**
  * Run an action once an animation on a control ends. If the control has no animation, the action will be executed immediately.
 - *
 + * The action will be executed after the animation ends or after the timeout, whichever comes first.
  * @param {HTMLElement} control - The control element to listen for animation end event
  * @param {(control:*?) => void} callback - The callback function to be executed when the animation ends
 + * @param {number} [timeout=500] - The timeout in milliseconds to wait for the animation to end before executing the callback
  */
 export function runAfterAnimation(control, callback, timeout = 500) {
     if (hasAnimation(control)) {
 -        const onAnimationEnd = () => {
 +        Promise.race([
 -            control.removeEventListener('animationend', onAnimationEnd);
 +            new Promise((r) => setTimeout(r, timeout)), // Fallback timeout
 -            callback(control);
 +            new Promise((r) => control.addEventListener('animationend', r, { once: true })),
 -        };
 +        ]).finally(() => callback(control));
 -        control.addEventListener('animationend', onAnimationEnd);
     } else {
         callback(control);
+    }