keep parent only as element

2 files changed, 15 insertions, 19 deletions

diff --git a/js/src/collapse.js b/js/src/collapse.js
index 550eeeaec..74c2f4da5 100644
--- a/js/src/collapse.js
+++ b/js/src/collapse.js
@@ -32,12 +32,12 @@ const DATA_API_KEY = '.data-api'
 
 const Default = {
   toggle: true,
-  parent: ''
+  parent: null
 }
 
 const DefaultType = {
   toggle: 'boolean',
-  parent: '(string|element)'
+  parent: '(null|element)'
 }
 
 const EVENT_SHOW = `show${EVENT_KEY}`
@@ -86,7 +86,7 @@ class Collapse extends BaseComponent {
       }
     }
 
-    this._parent = this._config.parent ? this._getParent() : null
+    this._initializeChildren()
 
     if (!this._config.parent) {
       this._addAriaAndCollapsedClass(this._triggerArray, this._isShown())
@@ -125,9 +125,9 @@ class Collapse extends BaseComponent {
     let actives = []
     let activesData
 
-    if (this._parent) {
-      const children = SelectorEngine.find(`.${CLASS_NAME_COLLAPSE} .${CLASS_NAME_COLLAPSE}`, this._parent)
-      actives = SelectorEngine.find(SELECTOR_ACTIVES, this._parent).filter(elem => !children.includes(elem)) // remove children if greater depth
+    if (this._config.parent) {
+      const children = SelectorEngine.find(`.${CLASS_NAME_COLLAPSE} .${CLASS_NAME_COLLAPSE}`, this._config.parent)
+      actives = SelectorEngine.find(SELECTOR_ACTIVES, this._config.parent).filter(elem => !children.includes(elem)) // remove children if greater depth
     }
 
     const container = SelectorEngine.findOne(this._selector)
@@ -239,6 +239,7 @@ class Collapse extends BaseComponent {
       ...config
     }
     config.toggle = Boolean(config.toggle) // Coerce string values
+    config.parent = getElement(config.parent)
     typeCheckConfig(NAME, config, DefaultType)
     return config
   }
@@ -247,14 +248,13 @@ class Collapse extends BaseComponent {
     return this._element.classList.contains(CLASS_NAME_HORIZONTAL) ? WIDTH : HEIGHT
   }
 
-  _getParent() {
-    let { parent } = this._config
-
-    parent = getElement(parent)
-
-    const selector = `${SELECTOR_DATA_TOGGLE}[data-bs-parent="${parent}"]`
+  _initializeChildren() {
+    if (!this._config.parent) {
+      return
+    }
 
-    SelectorEngine.find(selector, parent)
+    const children = SelectorEngine.find(`.${CLASS_NAME_COLLAPSE} .${CLASS_NAME_COLLAPSE}`, this._config.parent)
+    SelectorEngine.find(SELECTOR_DATA_TOGGLE, this._config.parent).filter(elem => !children.includes(elem))
       .forEach(element => {
         const selected = getElementFromSelector(element)
 
@@ -262,8 +262,6 @@ class Collapse extends BaseComponent {
           this._addAriaAndCollapsedClass([element], this._isShown(selected))
         }
       })
-
-    return parent
   }
 
   _addAriaAndCollapsedClass(triggerArray, isOpen) {
diff --git a/js/tests/unit/collapse.spec.js b/js/tests/unit/collapse.spec.js
index 9bce3f0bb..6220623fc 100644
--- a/js/tests/unit/collapse.spec.js
+++ b/js/tests/unit/collapse.spec.js
@@ -65,8 +65,7 @@ describe('Collapse', () => {
         parent: fakejQueryObject
       })
 
-      expect(collapse._config.parent).toEqual(fakejQueryObject)
-      expect(collapse._getParent()).toEqual(myCollapseEl)
+      expect(collapse._config.parent).toEqual(myCollapseEl)
     })
 
     it('should allow non jquery object in parent config', () => {
@@ -104,8 +103,7 @@ describe('Collapse', () => {
         parent: 'div.my-collapse'
       })
 
-      expect(collapse._config.parent).toEqual('div.my-collapse')
-      expect(collapse._getParent()).toEqual(myCollapseEl)
+      expect(collapse._config.parent).toEqual(myCollapseEl)
     })
   })