sharpetronics/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-11-09 00:12:36 -05:00
Code Issues Projects Releases Wiki Activity

Merge 125715c385bc4503a5902b937ec52a2909dd0926 into 815af314f34add7b0a3012b703fc95884968a95e

Browse Source
This commit is contained in:
GeoSot 2025-10-29 20:34:48 -10:00 committed by GitHub
commit abce8a731e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 49 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
js/src/collapse.js
View File

@ -122,7 +122,7 @@ class Collapse extends BaseComponent {
.map(element => Collapse.getOrCreateInstance(element, { toggle: false }))
}
if (activeChildren.length && activeChildren[0]._isTransitioning) {
if (activeChildren.some(instance => instance._isTransitioning)) {
return
}
@ -137,7 +137,6 @@ class Collapse extends BaseComponent {
const dimension = this._getDimension()
this._element.classList.remove(CLASS_NAME_COLLAPSE)
this._element.classList.add(CLASS_NAME_COLLAPSING)
this._element.style[dimension] = 0
@ -149,7 +148,7 @@ class Collapse extends BaseComponent {
this._isTransitioning = false
this._element.classList.remove(CLASS_NAME_COLLAPSING)
this._element.classList.add(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW)
this._element.classList.add(CLASS_NAME_SHOW)
this._element.style[dimension] = ''
@ -180,7 +179,7 @@ class Collapse extends BaseComponent {
reflow(this._element)
this._element.classList.add(CLASS_NAME_COLLAPSING)
this._element.classList.remove(CLASS_NAME_COLLAPSE, CLASS_NAME_SHOW)
this._element.classList.remove(CLASS_NAME_SHOW)
for (const trigger of this._triggerArray) {
const element = SelectorEngine.getElementFromSelector(trigger)
@ -195,7 +194,6 @@ class Collapse extends BaseComponent {
const complete = () => {
this._isTransitioning = false
this._element.classList.remove(CLASS_NAME_COLLAPSING)
this._element.classList.add(CLASS_NAME_COLLAPSE)
EventHandler.trigger(this._element, EVENT_HIDDEN)
}

45
js/tests/unit/collapse.spec.js
View File

@ -333,6 +333,51 @@ describe('Collapse', () => {
})
})
it('should be able to handle quick toggling between siblings', () =>
new Promise(resolve => {
fixtureEl.innerHTML = [
'<div class="accordion" id="accordionExample">',
' <div class="accordion-item">',
' <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">',
' Accordion Item #1',
' </button>',
' <div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">',
' </div>',
' </div>',
' <div class="accordion-item">',
' <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">',
' Accordion Item #2',
' </button>',
' <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">',
' </div>',
' </div>',
'</div>'
].join('')
const el = selector => fixtureEl.querySelector(selector)
const btn1 = el('[data-bs-target="#collapseOne"]')
const btn2 = el('[data-bs-target="#collapseTwo"]')
const collapseEl1 = el('#collapseOne')
const collapseEl2 = el('#collapseTwo')
collapseEl2.addEventListener('shown.bs.collapse', () => {
throw new Error('should not fire shown event')
})
collapseEl1.addEventListener('shown.bs.collapse', () => {
setTimeout(() => {
expect(collapseEl2).not.toHaveClass('show')
resolve()
}, 1000)
})
btn1.click()
btn2.click()
})
)
it('should not change tab tabpanels descendants on accordion', () => {
return new Promise(resolve => {
fixtureEl.innerHTML = [

2
scss/_transitions.scss
View File

@ -8,7 +8,7 @@
// scss-docs-start collapse-classes
.collapse {
&:not(.show) {
&:not(.show):not(.collapsing) {
display: none;
}
}