Merge fbbccac00e4887c91f72472faf23aa03aa582573 into 380a1d738b221fecc964260add053997399be4d4

js/dist/collapse.js

@@ -99,8 +99,6 @@
         return;
       }
       let activeChildren = [];
-
-      // find active children
       if (this._config.parent) {
         activeChildren = this._getFirstLevelChildren(SELECTOR_ACTIVES).filter(element => element !== this._element).map(element => Collapse.getOrCreateInstance(element, {
           toggle: false
@@ -122,11 +120,24 @@
       this._element.style[dimension] = 0;
       this._addAriaAndCollapsedClass(this._triggerArray, true);
       this._isTransitioning = true;
+
+      // 🔧 Firefox scroll jump fix
+      const isFirefox = navigator.userAgent.toLowerCase().includes('firefox');
+      let originalScrollMarginTop = '';
+      if (isFirefox) {
+        originalScrollMarginTop = this._element.style.scrollMarginTop;
+        this._element.style.scrollMarginTop = '0px';
+      }
       const complete = () => {
         this._isTransitioning = false;
         this._element.classList.remove(CLASS_NAME_COLLAPSING);
         this._element.classList.add(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW);
         this._element.style[dimension] = '';
+
+        // ✅ Restore original scroll-margin-top
+        if (isFirefox) {
+          this._element.style.scrollMarginTop = originalScrollMarginTop;
+        }
         EventHandler.trigger(this._element, EVENT_SHOWN);
       };
       const capitalizedDimension = dimension[0].toUpperCase() + dimension.slice(1);

js/src/collapse.js

@@ -115,7 +115,6 @@ class Collapse extends BaseComponent {
 
     let activeChildren = []
 
-    // find active children
     if (this._config.parent) {
       activeChildren = this._getFirstLevelChildren(SELECTOR_ACTIVES)
         .filter(element => element !== this._element)
@@ -145,6 +144,15 @@ class Collapse extends BaseComponent {
     this._addAriaAndCollapsedClass(this._triggerArray, true)
     this._isTransitioning = true
 
+    // 🔧 Firefox scroll jump fix
+    const isFirefox = navigator.userAgent.toLowerCase().includes('firefox')
+    let originalScrollMarginTop = ''
+
+    if (isFirefox) {
+      originalScrollMarginTop = this._element.style.scrollMarginTop
+      this._element.style.scrollMarginTop = '0px'
+    }
+
     const complete = () => {
       this._isTransitioning = false
 
@@ -153,6 +161,11 @@ class Collapse extends BaseComponent {
 
       this._element.style[dimension] = ''
 
+      // ✅ Restore original scroll-margin-top
+      if (isFirefox) {
+        this._element.style.scrollMarginTop = originalScrollMarginTop
+      }
+
       EventHandler.trigger(this._element, EVENT_SHOWN)
     }