diff options
author | GeoSot <geo.sotis@gmail.com> | 2021-10-10 15:09:57 +0300 |
---|---|---|
committer | XhmikosR <xhmikosr@gmail.com> | 2021-12-01 18:10:39 +0300 |
commit | fb5921dec49da37e9bab745d7319037e89e2f31e (patch) | |
tree | 2f9eb720f5ad7607cdeb5b70a0388c37cd3e402f /js | |
parent | 137b3249304b9ffeb76c72b7094ae7f170993016 (diff) |
Dropdown: Merge `display='static'` & `isNavbar` functionality activating static popper with no styles attached
Diffstat (limited to 'js')
-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() }) |