mirror of
https://github.com/twbs/bootstrap.git
synced 2025-02-20 17:54:23 +01:00
dropdown show method should do the same as toggle
This commit is contained in:
parent
b02bae769e
commit
a5cbb5e71a
@ -135,7 +135,6 @@ class Dropdown {
|
||||
return
|
||||
}
|
||||
|
||||
const parent = Dropdown.getParentFromElement(this._element)
|
||||
const isActive = this._menu.classList.contains(ClassName.SHOW)
|
||||
|
||||
Dropdown.clearMenus()
|
||||
@ -144,9 +143,19 @@ class Dropdown {
|
||||
return
|
||||
}
|
||||
|
||||
this.show()
|
||||
}
|
||||
|
||||
show() {
|
||||
if (this._element.disabled || this._element.classList.contains(ClassName.DISABLED) || this._menu.classList.contains(ClassName.SHOW)) {
|
||||
return
|
||||
}
|
||||
|
||||
const parent = Dropdown.getParentFromElement(this._element)
|
||||
const relatedTarget = {
|
||||
relatedTarget: this._element
|
||||
}
|
||||
|
||||
const showEvent = EventHandler.trigger(parent, Event.SHOW, relatedTarget)
|
||||
|
||||
if (showEvent.defaultPrevented) {
|
||||
@ -200,27 +209,6 @@ class Dropdown {
|
||||
EventHandler.trigger(parent, Event.SHOWN, relatedTarget)
|
||||
}
|
||||
|
||||
show() {
|
||||
if (this._element.disabled || this._element.classList.contains(ClassName.DISABLED) || this._menu.classList.contains(ClassName.SHOW)) {
|
||||
return
|
||||
}
|
||||
|
||||
const parent = Dropdown.getParentFromElement(this._element)
|
||||
const relatedTarget = {
|
||||
relatedTarget: this._element
|
||||
}
|
||||
|
||||
const showEvent = EventHandler.trigger(parent, Event.SHOW, relatedTarget)
|
||||
|
||||
if (showEvent.defaultPrevented) {
|
||||
return
|
||||
}
|
||||
|
||||
Manipulator.toggleClass(this._menu, ClassName.SHOW)
|
||||
Manipulator.toggleClass(parent, ClassName.SHOW)
|
||||
EventHandler.trigger(parent, Event.SHOWN, relatedTarget)
|
||||
}
|
||||
|
||||
hide() {
|
||||
if (this._element.disabled || this._element.classList.contains(ClassName.DISABLED) || !this._menu.classList.contains(ClassName.SHOW)) {
|
||||
return
|
||||
@ -237,6 +225,10 @@ class Dropdown {
|
||||
return
|
||||
}
|
||||
|
||||
if (this._popper) {
|
||||
this._popper.destroy()
|
||||
}
|
||||
|
||||
Manipulator.toggleClass(this._menu, ClassName.SHOW)
|
||||
Manipulator.toggleClass(parent, ClassName.SHOW)
|
||||
EventHandler.trigger(parent, Event.HIDDEN, relatedTarget)
|
||||
|
@ -174,7 +174,6 @@ describe('Dropdown', () => {
|
||||
expect(firstDropdownEl.classList.contains('show')).toEqual(true)
|
||||
spyOn(dropdown1._popper, 'destroy')
|
||||
dropdown2.toggle()
|
||||
done()
|
||||
})
|
||||
|
||||
secondDropdownEl.addEventListener('shown.bs.dropdown', () => {
|
||||
@ -679,6 +678,33 @@ describe('Dropdown', () => {
|
||||
dropdown.hide()
|
||||
})
|
||||
|
||||
it('should hide a dropdown and destroy popper', done => {
|
||||
fixtureEl.innerHTML = [
|
||||
'<div class="dropdown">',
|
||||
' <button href="#" class="btn dropdown-toggle" data-toggle="dropdown">Dropdown</button>',
|
||||
' <div class="dropdown-menu">',
|
||||
' <a class="dropdown-item" href="#">Secondary link</a>',
|
||||
' </div>',
|
||||
'</div>'
|
||||
].join('')
|
||||
|
||||
const btnDropdown = fixtureEl.querySelector('[data-toggle="dropdown"]')
|
||||
const dropdownEl = fixtureEl.querySelector('.dropdown')
|
||||
const dropdown = new Dropdown(btnDropdown)
|
||||
|
||||
dropdownEl.addEventListener('shown.bs.dropdown', () => {
|
||||
spyOn(dropdown._popper, 'destroy')
|
||||
dropdown.hide()
|
||||
})
|
||||
|
||||
dropdownEl.addEventListener('hidden.bs.dropdown', () => {
|
||||
expect(dropdown._popper.destroy).toHaveBeenCalled()
|
||||
done()
|
||||
})
|
||||
|
||||
dropdown.show()
|
||||
})
|
||||
|
||||
it('should not hide a dropdown if the element is disabled', done => {
|
||||
fixtureEl.innerHTML = [
|
||||
'<div class="dropdown">',
|
||||
|
Loading…
x
Reference in New Issue
Block a user