mirror of
https://github.com/twbs/bootstrap.git
synced 2025-08-12 08:34:08 +02:00
Fix Collapse regression of handling toggling between sibling chilldren (#34951)
This commit is contained in:
@@ -267,6 +267,63 @@ describe('Collapse', () => {
|
||||
collapse.show()
|
||||
})
|
||||
|
||||
it('should be able to handle toggling of other children siblings', done => {
|
||||
fixtureEl.innerHTML = [
|
||||
'<div id="parentGroup" class="accordion">',
|
||||
' <div id="parentHeader" class="accordion-header">',
|
||||
' <button data-bs-target="#parentContent" data-bs-toggle="collapse" role="button" class="accordion-toggle">Parent</button>',
|
||||
' </div>',
|
||||
' <div id="parentContent" class="accordion-collapse collapse" aria-labelledby="parentHeader" data-bs-parent="#parentGroup">',
|
||||
' <div class="accordion-body">',
|
||||
' <div id="childGroup" class="accordion">',
|
||||
' <div class="accordion-item">',
|
||||
' <div id="childHeader1" class="accordion-header">',
|
||||
' <button data-bs-target="#childContent1" data-bs-toggle="collapse" role="button" class="accordion-toggle">Child 1</button>',
|
||||
' </div>',
|
||||
' <div id="childContent1" class="accordion-collapse collapse" aria-labelledby="childHeader1" data-bs-parent="#childGroup">',
|
||||
' <div>content</div>',
|
||||
' </div>',
|
||||
' </div>',
|
||||
' <div class="accordion-item">',
|
||||
' <div id="childHeader2" class="accordion-header">',
|
||||
' <button data-bs-target="#childContent2" data-bs-toggle="collapse" role="button" class="accordion-toggle">Child 2</button>',
|
||||
' </div>',
|
||||
' <div id="childContent2" class="accordion-collapse collapse" aria-labelledby="childHeader2" data-bs-parent="#childGroup">',
|
||||
' <div>content</div>',
|
||||
' </div>',
|
||||
' </div>',
|
||||
' </div>',
|
||||
' </div>',
|
||||
' </div>',
|
||||
'</div>'
|
||||
].join('')
|
||||
|
||||
const el = selector => fixtureEl.querySelector(selector)
|
||||
|
||||
const parentBtn = el('[data-bs-target="#parentContent"]')
|
||||
const childBtn1 = el('[data-bs-target="#childContent1"]')
|
||||
const childBtn2 = el('[data-bs-target="#childContent2"]')
|
||||
|
||||
const parentCollapseEl = el('#parentContent')
|
||||
const childCollapseEl1 = el('#childContent1')
|
||||
const childCollapseEl2 = el('#childContent2')
|
||||
|
||||
parentCollapseEl.addEventListener('shown.bs.collapse', () => {
|
||||
expect(parentCollapseEl.classList.contains('show')).toEqual(true)
|
||||
childBtn1.click()
|
||||
})
|
||||
childCollapseEl1.addEventListener('shown.bs.collapse', () => {
|
||||
expect(childCollapseEl1.classList.contains('show')).toEqual(true)
|
||||
childBtn2.click()
|
||||
})
|
||||
childCollapseEl2.addEventListener('shown.bs.collapse', () => {
|
||||
expect(childCollapseEl2.classList.contains('show')).toEqual(true)
|
||||
expect(childCollapseEl1.classList.contains('show')).toEqual(false)
|
||||
done()
|
||||
})
|
||||
|
||||
parentBtn.click()
|
||||
})
|
||||
it('should not change tab tabpanels descendants on accordion', done => {
|
||||
fixtureEl.innerHTML = [
|
||||
'<div class="accordion" id="accordionExample">',
|
||||
|
Reference in New Issue
Block a user