rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-29 11:24:18 +01:00
Code Issues Actions Packages Releases Activity

Backport #29298

Browse Source 
dropdown show method should do the same as toggle
This commit is contained in:
Johann-S 2019-08-25 18:12:02 +02:00 committed by XhmikosR
parent dd181e91bd
commit ef1c7aadbc
3 changed files with 51 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
bundlesize.config.json
View File

@ -26,7 +26,7 @@
},
{
"path": "./dist/js/bootstrap.bundle.js",
"maxSize": "47 kB"
"maxSize": "47.50 kB"
},
{
"path": "./dist/js/bootstrap.bundle.min.js",

39
js/src/dropdown.js
View File

@ -126,7 +126,6 @@ class Dropdown {
return
}
const parent = Dropdown._getParentFromElement(this._element)
const isActive = $(this._menu).hasClass(ClassName.SHOW)
Dropdown._clearMenus()
@ -135,10 +134,19 @@ class Dropdown {
return
}
this.show(true)
}
show(usePopper = false) {
if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED) || $(this._menu).hasClass(ClassName.SHOW)) {
return
}
const relatedTarget = {
relatedTarget: this._element
}
const showEvent = $.Event(Event.SHOW, relatedTarget)
const parent = Dropdown._getParentFromElement(this._element)
$(parent).trigger(showEvent)
@ -147,7 +155,7 @@ class Dropdown {
}
// Disable totally Popper.js for Dropdown in Navbar
if (!this._inNavbar) {
if (!this._inNavbar && usePopper) {
/**
* Check for Popper dependency
* Popper - https://popper.js.org
@ -196,29 +204,6 @@ class Dropdown {
.trigger($.Event(Event.SHOWN, relatedTarget))
}
show() {
if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED) || $(this._menu).hasClass(ClassName.SHOW)) {
return
}
const relatedTarget = {
relatedTarget: this._element
}
const showEvent = $.Event(Event.SHOW, relatedTarget)
const parent = Dropdown._getParentFromElement(this._element)
$(parent).trigger(showEvent)
if (showEvent.isDefaultPrevented()) {
return
}
$(this._menu).toggleClass(ClassName.SHOW)
$(parent)
.toggleClass(ClassName.SHOW)
.trigger($.Event(Event.SHOWN, relatedTarget))
}
hide() {
if (this._element.disabled || $(this._element).hasClass(ClassName.DISABLED) || !$(this._menu).hasClass(ClassName.SHOW)) {
return
@ -236,6 +221,10 @@ class Dropdown {
return
}
if (this._popper) {
this._popper.destroy()
}
$(this._menu).toggleClass(ClassName.SHOW)
$(parent)
.toggleClass(ClassName.SHOW)

37
js/tests/unit/dropdown.js
View File

@ -1272,7 +1272,7 @@ $(function () {
})
QUnit.test('should show dropdown', function (assert) {
assert.expect(2)
assert.expect(3)
var dropdownHTML =
'<div class="dropdown">' +
@ -1293,6 +1293,7 @@ $(function () {
$dropdown
.parent('.dropdown')
.on('show.bs.dropdown', function () {
assert.ok(dropdown._popper === null)
assert.ok(true, 'show was fired')
})
.on('shown.bs.dropdown', function () {
@ -1550,4 +1551,38 @@ $(function () {
dropdown1.toggle()
})
QUnit.test('should hide a dropdown and destroy popper', function (assert) {
assert.expect(1)
var done = assert.async()
var fixtureHtml = [
'<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('')
$(fixtureHtml).appendTo('#qunit-fixture')
var $dropdownEl = $('.dropdown')
var dropdown = $('[data-toggle="dropdown"]')
.bootstrapDropdown()
.data('bs.dropdown')
var spyPopper
$dropdownEl.one('shown.bs.dropdown', function () {
spyPopper = sinon.spy(dropdown._popper, 'destroy')
dropdown.hide()
})
$dropdownEl.one('hidden.bs.dropdown', function () {
assert.ok(spyPopper.called)
done()
})
dropdown.show(true)
})
})