[FIX] website: prevent infinite loop in header animation code

Bug introduced by [1]. When the header starts being animated, the main
padding-top of the page is adapted automatically with JS... but that
JS was actually starting a never-ending loop. This is fixed now.

[1]: https://github.com/odoo/odoo/commit/3defe35a0e4e2097115633797df6898ac2724c66

closes odoo/odoo#51726

X-original-commit: 07ed02608b8f4e3744c5e69c2651aa3df8bdd943
Signed-off-by: bvr-odoo <bvr-odoo@users.noreply.github.com>

1 files changed, 15 insertions, 4 deletions

diff --git a/addons/website/static/src/js/content/menu.js b/addons/website/static/src/js/content/menu.js
index c0b82c58a21..c2959c40fcb 100644
--- a/addons/website/static/src/js/content/menu.js
+++ b/addons/website/static/src/js/content/menu.js
@@ -97,12 +97,23 @@ const BaseAnimatedHeader = animations.Animation.extend({
         this._transitionCount += addCount;
         this._transitionCount = Math.max(0, this._transitionCount);
 
-        // The normal case would be to have the transitionend event to be
-        // fired but we cannot rely on it, so we use a timeout as fallback.
-        clearTimeout(this._paddingLoopTimer);
+        // As long as we detected a transition start without its related
+        // transition end, keep updating the main padding top.
         if (this._transitionCount > 0) {
             window.requestAnimationFrame(() => this._updateMainPaddingTopLoop());
-            this._paddingLoopTimer = setTimeout(() => this._updateMainPaddingTopLoop(-1), 500);
+
+            // The normal case would be to have the transitionend event to be
+            // fired but we cannot rely on it, so we use a timeout as fallback.
+            if (addCount !== 0) {
+                clearTimeout(this._paddingLoopTimer);
+                this._paddingLoopTimer = setTimeout(() => {
+                    this._updateMainPaddingTopLoop(-this._transitionCount);
+                }, 500);
+            }
+        } else {
+            // When we detected all transitionend events, we need to stop the
+            // setTimeout fallback.
+            clearTimeout(this._paddingLoopTimer);
         }
     },