diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 607ab27ba7..f8dafc21bd 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -96,7 +96,9 @@ class Dropdown extends BaseComponent { this._popper = null this._parent = this._element.parentNode // dropdown wrapper // todo: v6 revert #37011 & change markup https://getbootstrap.com/docs/5.2/forms/input-group/ - this._menu = SelectorEngine.next(this._element, SELECTOR_MENU)[0] || SelectorEngine.prev(this._element, SELECTOR_MENU)[0] + this._menu = SelectorEngine.next(this._element, SELECTOR_MENU)[0] || + SelectorEngine.prev(this._element, SELECTOR_MENU)[0] || + SelectorEngine.findOne(SELECTOR_MENU, this._parent) this._inNavbar = this._detectNavbar() } @@ -407,7 +409,12 @@ class Dropdown extends BaseComponent { event.preventDefault() // todo: v6 revert #37011 & change markup https://getbootstrap.com/docs/5.2/forms/input-group/ - const getToggleButton = this.matches(SELECTOR_DATA_TOGGLE) ? this : SelectorEngine.prev(this, SELECTOR_DATA_TOGGLE)[0] || SelectorEngine.next(this, SELECTOR_DATA_TOGGLE)[0] + const getToggleButton = this.matches(SELECTOR_DATA_TOGGLE) ? + this : + (SelectorEngine.prev(this, SELECTOR_DATA_TOGGLE)[0] || + SelectorEngine.next(this, SELECTOR_DATA_TOGGLE)[0] || + SelectorEngine.findOne(SELECTOR_DATA_TOGGLE, event.delegateTarget.parentNode)) + const instance = Dropdown.getOrCreateInstance(getToggleButton) if (isUpOrDownEvent) { diff --git a/js/tests/unit/dropdown.spec.js b/js/tests/unit/dropdown.spec.js index ea7ddace30..2bbd7c00a7 100644 --- a/js/tests/unit/dropdown.spec.js +++ b/js/tests/unit/dropdown.spec.js @@ -57,6 +57,28 @@ describe('Dropdown', () => { expect(dropdownByElement._element).toEqual(btnDropdown) }) + it('should work on invalid markup', () => { + return new Promise(resolve => { + // TODO: REMOVE in v6 + fixtureEl.innerHTML = [ + '