Update loader being removed correctly on manually forced transition duration (#3384) --------- Co-authored-by: Cohee <18619528+Cohee1207@users.noreply.github.com>

578c3dda73d654f33a6eedf4a38a9630964a7c2c

IceFog72 <164350516+IceFog72@users.noreply.github.com>

Signed

Parents: 0c121ee95ad62538a897d37ca2e32c57cffeeb8e

public/scripts/loader.js+33 -12 Viewed

+    }
     return new Promise((resolve) => {
-        // Spinner blurs/fades out
+        const spinner = $('#load-spinner');
-        $('#load-spinner').on('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', function () {
+        if (!spinner.length) {
+            console.warn('Spinner element not found, skipping animation');
+            cleanup();
+            return;
+        }
+        // Check if transitions are enabled
+        const transitionDuration = spinner[0] ? getComputedStyle(spinner[0]).transitionDuration : '0s';
+        const hasTransitions = parseFloat(transitionDuration) > 0;
+        if (hasTransitions) {
+            Promise.race([
+                new Promise((r) => setTimeout(r, 500)), // Fallback timeout
+                new Promise((r) => spinner.one('transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd', r)),
+            ]).finally(cleanup);
+        } else {
+            cleanup();
+        }
+        function cleanup() {
             $('#loader').remove();
             // Yoink preloader entirely; it only exists to cover up unstyled content while loading JS
             // If it's present, we remove it once and then it's gone.
             yoinkPreloader();
-            loaderPopup.complete(POPUP_RESULT.AFFIRMATIVE).then(() => {
+            loaderPopup.complete(POPUP_RESULT.AFFIRMATIVE)
-                loaderPopup = null;
+                .catch((err) => console.error('Error completing loaderPopup:', err))
-                resolve();
+                .finally(() => {
-            });
+                    loaderPopup = null;
-        });
+                    resolve();
+                });
+        }
-        $('#load-spinner')
+        // Apply the styles
-            .css({
+        spinner.css({
-                'filter': 'blur(15px)',
+            'filter': 'blur(15px)',
-                'opacity': '0',
+            'opacity': '0',
-            });
+        });
     });
+}