Fix bug multiple accordions collapse

2 files changed, 24 insertions, 1 deletions

diff --git a/js/src/collapse.js b/js/src/collapse.js
index 560ab2cbd..b784b82b6 100644
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -121,7 +121,7 @@ const Collapse = (($) => {
       let activesData
 
       if (this._parent) {
-        actives = $.makeArray($(Selector.ACTIVES))
+        actives = $.makeArray($(this._parent).find(Selector.ACTIVES))
         if (!actives.length) {
           actives = null
         }
diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js
index 892da52ed..dba15e865 100644
--- a/js/tests/unit/collapse.js
+++ b/js/tests/unit/collapse.js
@@ -52,6 +52,29 @@ $(function () {
     assert.ok(!/height/i.test($el.attr('style')), 'has height reset')
   })
 
+  QUnit.test('should collapse only the first collapse', function (assert) {
+    assert.expect(2)
+    var html = [
+      '<div class="panel-group" id="accordion1">',
+        '<div class="panel">',
+          '<div id="collapse1" class="collapse"/>',
+        '</div>',
+      '</div>',
+      '<div class="panel-group" id="accordion2">',
+        '<div class="panel">',
+          '<div id="collapse2" class="collapse in"/>',
+        '</div>',
+      '</div>'
+    ].join('')
+    $(html).appendTo('#qunit-fixture')
+    var $el1 = $('#collapse1')
+    var $el2 = $('#collapse2')
+    $el1.bootstrapCollapse('show')
+
+    assert.ok($el1.hasClass('in'))
+    assert.ok($el2.hasClass('in'))
+  })
+
   QUnit.test('should hide a collapsed element', function (assert) {
     assert.expect(1)
     var $el = $('<div class="collapse"/>').bootstrapCollapse('hide')