From 099486f294e79bfe1f2c6b431ee4696237f616cd Mon Sep 17 00:00:00 2001
From: Johann-S <johann.servoire@gmail.com>
Date: Tue, 7 Mar 2017 10:46:08 +0100
Subject: [PATCH 1/3] Detach accordions from .card

---
 js/src/collapse.js | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/js/src/collapse.js b/js/src/collapse.js
index 28c4493cc5..e2c9efe11a 100644
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -57,7 +57,8 @@ const Collapse = (($) => {
 
   const Selector = {
     ACTIVES     : '.card > .show, .card > .collapsing',
-    DATA_TOGGLE : '[data-toggle="collapse"]'
+    DATA_TOGGLE : '[data-toggle="collapse"]',
+    DATA_CHILDREN : 'data-children'
   }
 
 
@@ -84,6 +85,14 @@ const Collapse = (($) => {
         this._addAriaAndCollapsedClass(this._element, this._triggerArray)
       }
 
+      this._selectorActives = Selector.ACTIVES
+      if (this._parent) {
+        const childrenSelector = this._parent.hasAttribute(Selector.DATA_CHILDREN) ? this._parent.getAttribute(Selector.DATA_CHILDREN) : null
+        if (childrenSelector !== null) {
+          this._selectorActives = childrenSelector + ' > .show, ' + childrenSelector + ' > .collapsing'
+        }
+      }
+
       if (this._config.toggle) {
         this.toggle()
       }
@@ -124,7 +133,7 @@ const Collapse = (($) => {
       let activesData
 
       if (this._parent) {
-        actives = $.makeArray($(this._parent).find(Selector.ACTIVES))
+        actives = $.makeArray($(this._parent).find(this._selectorActives))
         if (!actives.length) {
           actives = null
         }

From fa1504e6f68974114e3ab58b8b18a601bc973103 Mon Sep 17 00:00:00 2001
From: Johann-S <johann.servoire@gmail.com>
Date: Wed, 8 Mar 2017 11:15:58 +0100
Subject: [PATCH 2/3] Fix code style

---
 js/src/collapse.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/js/src/collapse.js b/js/src/collapse.js
index e2c9efe11a..0776519ff9 100644
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -78,7 +78,6 @@ const Collapse = (($) => {
         `[data-toggle="collapse"][href="#${element.id}"],` +
         `[data-toggle="collapse"][data-target="#${element.id}"]`
       ))
-
       this._parent = this._config.parent ? this._getParent() : null
 
       if (!this._config.parent) {
@@ -89,7 +88,7 @@ const Collapse = (($) => {
       if (this._parent) {
         const childrenSelector = this._parent.hasAttribute(Selector.DATA_CHILDREN) ? this._parent.getAttribute(Selector.DATA_CHILDREN) : null
         if (childrenSelector !== null) {
-          this._selectorActives = childrenSelector + ' > .show, ' + childrenSelector + ' > .collapsing'
+          this._selectorActives = `${childrenSelector} > .show, ${childrenSelector} > .collapsing`
         }
       }
 

From 21b537cc2424f8b51044ad93c70993f29780524a Mon Sep 17 00:00:00 2001
From: Johann-S <johann.servoire@gmail.com>
Date: Thu, 9 Mar 2017 11:08:47 +0100
Subject: [PATCH 3/3] Add unit test

---
 js/tests/unit/collapse.js | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js
index 7139304338..c39adacdb0 100644
--- a/js/tests/unit/collapse.js
+++ b/js/tests/unit/collapse.js
@@ -490,4 +490,27 @@ $(function () {
       .bootstrapCollapse('show')
   })
 
+  QUnit.test('should allow accordion to use children other than card', function (assert) {
+    assert.expect(2)
+    var done = assert.async()
+    var accordionHTML = '<div id="accordion" data-children=".item">'
+        + '<div class="item">'
+        + '<a id="linkTrigger" data-parent="#accordion" data-toggle="collapse" href="#collapseOne" aria-expanded="false" aria-controls="collapseOne"></a>'
+        + '<div id="collapseOne" class="collapse" role="tabpanel" aria-labelledby="headingThree"></div>'
+        + '</div>'
+        + '<div class="item">'
+        + '<a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"></a>'
+        + '<div id="collapseTwo" class="collapse show" role="tabpanel" aria-labelledby="headingTwo"></div>'
+        + '</div>'
+        + '</div>'
+
+    $(accordionHTML).appendTo('#qunit-fixture')
+    var $target = $('#linkTrigger')
+    $('#collapseOne').on('shown.bs.collapse', function () {
+      assert.ok($(this).hasClass('show'))
+      assert.ok(!$('#collapseTwo').hasClass('show'))
+      done()
+    })
+    $target.trigger($.Event('click'))
+  })
 })