diff options
-rw-r--r-- | js/src/dropdown.js | 19 | ||||
-rw-r--r-- | js/tests/unit/dropdown.spec.js | 10 |
2 files changed, 10 insertions, 19 deletions
diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 06f69af7be..d5c42b012d 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -133,12 +133,8 @@ class Dropdown extends BaseComponent { } const parent = getElementFromSelector(this._element) || this._element.parentNode - // Totally disable Popper for Dropdowns in Navbar - if (this._inNavbar) { - Manipulator.setDataAttribute(this._menu, 'popper', 'none') - } else { - this._createPopper(parent) - } + + this._createPopper(parent) // If this is a touch-enabled device we add extra // empty mouseover listeners to the body's immediate children; @@ -246,13 +242,7 @@ class Dropdown extends BaseComponent { } const popperConfig = this._getPopperConfig() - const isDisplayStatic = popperConfig.modifiers.find(modifier => modifier.name === 'applyStyles' && modifier.enabled === false) - this._popper = Popper.createPopper(referenceElement, this._menu, popperConfig) - - if (isDisplayStatic) { - Manipulator.setDataAttribute(this._menu, 'popper', 'static') - } } _isShown(element = this._element) { @@ -319,8 +309,9 @@ class Dropdown extends BaseComponent { }] } - // Disable Popper if we have a static display - if (this._config.display === 'static') { + // Disable Popper if we have a static display or Dropdown is in Navbar + if (this._inNavbar || this._config.display === 'static') { + Manipulator.setDataAttribute(this._menu, 'popper', 'static') // todo:v6 remove defaultBsPopperConfig.modifiers = [{ name: 'applyStyles', enabled: false diff --git a/js/tests/unit/dropdown.spec.js b/js/tests/unit/dropdown.spec.js index bec0aae62e..aec70063ec 100644 --- a/js/tests/unit/dropdown.spec.js +++ b/js/tests/unit/dropdown.spec.js @@ -1054,7 +1054,7 @@ describe('Dropdown', () => { btnDropdown.click() }) - it('should not use Popper in navbar', done => { + it('should not use "static" Popper in navbar', done => { fixtureEl.innerHTML = [ '<nav class="navbar navbar-expand-md navbar-light bg-light">', ' <div class="dropdown">', @@ -1071,8 +1071,8 @@ describe('Dropdown', () => { const dropdown = new Dropdown(btnDropdown) btnDropdown.addEventListener('shown.bs.dropdown', () => { - expect(dropdown._popper).toBeNull() - expect(dropdownMenu.getAttribute('style')).toBeNull() + expect(dropdown._popper).not.toBeNull() + expect(dropdownMenu.getAttribute('data-bs-popper')).toEqual('static') done() }) @@ -1120,7 +1120,7 @@ describe('Dropdown', () => { dropdown.show() }) - it('should manage bs attribute `data-bs-popper`="none" when dropdown is in navbar', done => { + it('should manage bs attribute `data-bs-popper`="static" when dropdown is in navbar', done => { fixtureEl.innerHTML = [ '<nav class="navbar navbar-expand-md navbar-light bg-light">', ' <div class="dropdown">', @@ -1137,7 +1137,7 @@ describe('Dropdown', () => { const dropdown = new Dropdown(btnDropdown) btnDropdown.addEventListener('shown.bs.dropdown', () => { - expect(dropdownMenu.getAttribute('data-bs-popper')).toEqual('none') + expect(dropdownMenu.getAttribute('data-bs-popper')).toEqual('static') dropdown.hide() }) |