Add support for tooltip offset option to be a function.

2 files changed, 49 insertions, 4 deletions

diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 366781b3e8..0b6e21085f 100644
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -32,7 +32,7 @@ const DefaultType = {
   html              : 'boolean',
   selector          : '(string|boolean)',
   placement         : '(string|function)',
-  offset            : '(number|string)',
+  offset            : '(number|string|function)',
   container         : '(string|element|boolean)',
   fallbackPlacement : '(string|array)',
   boundary          : '(string|element)'
@@ -273,6 +273,16 @@ class Tooltip {
       const attachment = this._getAttachment(placement)
       this.addAttachmentClass(attachment)
 
+      const offsetConf = {}
+      if (typeof this.config.offset === 'function') {
+        offsetConf.fn = (data) => {
+          data.offsets = $.extend({}, data.offsets, this.config.offset(data.offsets, this.element) || {})
+          return data
+        }
+      } else {
+        offsetConf.offset = this.config.offset
+      }
+
       const container = this._getContainer()
       $(tip).data(this.constructor.DATA_KEY, this)
 
@@ -285,9 +295,7 @@ class Tooltip {
       this._popper = new Popper(this.element, tip, {
         placement: attachment,
         modifiers: {
-          offset: {
-            offset: this.config.offset
-          },
+          offset: offsetConf,
           flip: {
             behavior: this.config.fallbackPlacement
           },
diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index 54dbe57bd8..30829d24d5 100644
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -1069,4 +1069,41 @@ $(function () {
 
     assert.strictEqual(tooltip._isEnabled, true)
   })
+
+  QUnit.test('should create offset modifier correctly when offset option is a function', function (assert) {
+    assert.expect(2)
+
+    var getOffset = function (offsets) {
+      return offsets
+    }
+
+    var $trigger = $('<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>')
+      .appendTo('#qunit-fixture')
+      .bootstrapTooltip({
+        offset: getOffset
+      })
+
+    var tooltip = $trigger.data('bs.tooltip')
+    var offset = tooltip._getOffset()
+
+    assert.ok(typeof offset.offset === 'undefined')
+    assert.ok(typeof offset.fn === 'function')
+  })
+
+  QUnit.test('should create offset modifier correctly when offset option is not a function', function (assert) {
+    assert.expect(2)
+
+    var myOffset = 42
+    var $trigger = $('<a href="#" rel="tooltip" data-trigger="click" title="Another tooltip"/>')
+      .appendTo('#qunit-fixture')
+      .bootstrapTooltip({
+        offset: myOffset
+      })
+
+    var tooltip = $trigger.data('bs.tooltip')
+    var offset = tooltip._getOffset()
+
+    assert.strictEqual(offset.offset, myOffset)
+    assert.ok(typeof offset.fn === 'undefined')
+  })
 })