diff --git a/bundlesize.config.json b/bundlesize.config.json index b923dfb12e..8c33e3abb7 100644 --- a/bundlesize.config.json +++ b/bundlesize.config.json @@ -30,7 +30,7 @@ }, { "path": "./dist/js/bootstrap.bundle.min.js", - "maxSize": "22 kB" + "maxSize": "22.25 kB" }, { "path": "./dist/js/bootstrap.js", diff --git a/js/src/dropdown.js b/js/src/dropdown.js index 1121a9819e..c064c3461a 100644 --- a/js/src/dropdown.js +++ b/js/src/dropdown.js @@ -71,19 +71,21 @@ const AttachmentMap = { } const Default = { - offset : 0, - flip : true, - boundary : 'scrollParent', - reference : 'toggle', - display : 'dynamic' + offset : 0, + flip : true, + boundary : 'scrollParent', + reference : 'toggle', + display : 'dynamic', + popperConfig : null } const DefaultType = { - offset : '(number|string|function)', - flip : 'boolean', - boundary : '(string|element)', - reference : '(string|element)', - display : 'string' + offset : '(number|string|function)', + flip : 'boolean', + boundary : '(string|element)', + reference : '(string|element)', + display : 'string', + popperConfig : '(null|object)' } /** @@ -359,7 +361,10 @@ class Dropdown { } } - return popperConfig + return { + ...popperConfig, + ...this._config.popperConfig + } } // Static diff --git a/js/src/tooltip.js b/js/src/tooltip.js index b200656658..3bd495033e 100644 --- a/js/src/tooltip.js +++ b/js/src/tooltip.js @@ -43,7 +43,8 @@ const DefaultType = { boundary : '(string|element)', sanitize : 'boolean', sanitizeFn : '(null|function)', - whiteList : 'object' + whiteList : 'object', + popperConfig : '(null|object)' } const AttachmentMap = { @@ -71,7 +72,8 @@ const Default = { boundary : 'scrollParent', sanitize : true, sanitizeFn : null, - whiteList : DefaultWhitelist + whiteList : DefaultWhitelist, + popperConfig : null } const HoverState = { @@ -119,10 +121,6 @@ const Trigger = { class Tooltip { constructor(element, config) { - /** - * Check for Popper dependency - * Popper - https://popper.js.org - */ if (typeof Popper === 'undefined') { throw new TypeError('Bootstrap\'s tooltips require Popper.js (https://popper.js.org/)') } @@ -236,7 +234,7 @@ class Tooltip { this._timeout = null this._hoverState = null this._activeTrigger = null - if (this._popper !== null) { + if (this._popper) { this._popper.destroy() } @@ -293,27 +291,7 @@ class Tooltip { $(this.element).trigger(this.constructor.Event.INSERTED) - this._popper = new Popper(this.element, tip, { - placement: attachment, - modifiers: { - offset: this._getOffset(), - flip: { - behavior: this.config.fallbackPlacement - }, - arrow: { - element: Selector.ARROW - }, - preventOverflow: { - boundariesElement: this.config.boundary - } - }, - onCreate: (data) => { - if (data.originalPlacement !== data.placement) { - this._handlePopperPlacementChange(data) - } - }, - onUpdate: (data) => this._handlePopperPlacementChange(data) - }) + this._popper = new Popper(this.element, tip, this._getPopperConfig(attachment)) $(tip).addClass(ClassName.SHOW) @@ -468,6 +446,35 @@ class Tooltip { // Private + _getPopperConfig(attachment) { + const defaultBsConfig = { + placement: attachment, + modifiers: { + offset: this._getOffset(), + flip: { + behavior: this.config.fallbackPlacement + }, + arrow: { + element: Selector.ARROW + }, + preventOverflow: { + boundariesElement: this.config.boundary + } + }, + onCreate: (data) => { + if (data.originalPlacement !== data.placement) { + this._handlePopperPlacementChange(data) + } + }, + onUpdate: (data) => this._handlePopperPlacementChange(data) + } + + return { + ...defaultBsConfig, + ...this.config.popperConfig + } + } + _getOffset() { const offset = {} diff --git a/js/tests/unit/dropdown.js b/js/tests/unit/dropdown.js index 346b1a2e5a..85ebc0ed25 100644 --- a/js/tests/unit/dropdown.js +++ b/js/tests/unit/dropdown.js @@ -1480,4 +1480,30 @@ $(function () { assert.strictEqual(offset.offset, myOffset) assert.ok(typeof offset.fn === 'undefined') }) + + QUnit.test('should allow to pass config to popper.js with `popperConfig`', function (assert) { + assert.expect(1) + + var dropdownHTML = + '
static
.