Dropdown: get dropdown's parent in one place

This commit is contained in:
GeoSot 2021-12-13 02:10:26 +02:00 committed by XhmikosR
parent 74f24cdf24
commit 5f1c542d67
2 changed files with 8 additions and 13 deletions

View File

@ -49,7 +49,7 @@ const SelectorEngine = {
return [] return []
}, },
// TODO: this is now unused; remove later along with prev()
next(element, selector) { next(element, selector) {
let next = element.nextElementSibling let next = element.nextElementSibling

View File

@ -90,7 +90,8 @@ class Dropdown extends BaseComponent {
super(element, config) super(element, config)
this._popper = null this._popper = null
this._menu = this._getMenuElement() this._parent = getElementFromSelector(this._element) || this._element.parentNode // dropdown wrapper
this._menu = SelectorEngine.findOne(SELECTOR_MENU, this._parent)
this._inNavbar = this._detectNavbar() this._inNavbar = this._detectNavbar()
} }
@ -127,15 +128,13 @@ class Dropdown extends BaseComponent {
return return
} }
const parent = getElementFromSelector(this._element) || this._element.parentNode this._createPopper()
this._createPopper(parent)
// If this is a touch-enabled device we add extra // If this is a touch-enabled device we add extra
// empty mouseover listeners to the body's immediate children; // empty mouseover listeners to the body's immediate children;
// only needed because of broken event delegation on iOS // only needed because of broken event delegation on iOS
// https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html // https://www.quirksmode.org/blog/archives/2014/02/mouse_event_bub.html
if ('ontouchstart' in document.documentElement && !parent.closest(SELECTOR_NAVBAR_NAV)) { if ('ontouchstart' in document.documentElement && !this._parent.closest(SELECTOR_NAVBAR_NAV)) {
for (const element of [].concat(...document.body.children)) { for (const element of [].concat(...document.body.children)) {
EventHandler.on(element, 'mouseover', noop) EventHandler.on(element, 'mouseover', noop)
} }
@ -215,7 +214,7 @@ class Dropdown extends BaseComponent {
return config return config
} }
_createPopper(parent) { _createPopper() {
if (typeof Popper === 'undefined') { if (typeof Popper === 'undefined') {
throw new TypeError('Bootstrap\'s dropdowns require Popper (https://popper.js.org)') throw new TypeError('Bootstrap\'s dropdowns require Popper (https://popper.js.org)')
} }
@ -223,7 +222,7 @@ class Dropdown extends BaseComponent {
let referenceElement = this._element let referenceElement = this._element
if (this._config.reference === 'parent') { if (this._config.reference === 'parent') {
referenceElement = parent referenceElement = this._parent
} else if (isElement(this._config.reference)) { } else if (isElement(this._config.reference)) {
referenceElement = getElement(this._config.reference) referenceElement = getElement(this._config.reference)
} else if (typeof this._config.reference === 'object') { } else if (typeof this._config.reference === 'object') {
@ -238,12 +237,8 @@ class Dropdown extends BaseComponent {
return element.classList.contains(CLASS_NAME_SHOW) return element.classList.contains(CLASS_NAME_SHOW)
} }
_getMenuElement() {
return SelectorEngine.next(this._element, SELECTOR_MENU)[0]
}
_getPlacement() { _getPlacement() {
const parentDropdown = this._element.parentNode const parentDropdown = this._parent
if (parentDropdown.classList.contains(CLASS_NAME_DROPEND)) { if (parentDropdown.classList.contains(CLASS_NAME_DROPEND)) {
return PLACEMENT_RIGHT return PLACEMENT_RIGHT