Add attachment classes

diff --git a/js/src/popover.js b/js/src/popover.js
index 02efe2b2edeaf145cdb2481584c38e4f11d101e5..f89d3d5c8b41f182d42704b3e9ebac31c0e08a8b 100644 (file)
--- a/js/src/popover.js
+++ b/js/src/popover.js
@@ -22,6 +22,8 @@ const Popover = (($) => {
   const DATA_KEY            = 'bs.popover'
   const EVENT_KEY           = `.${DATA_KEY}`
   const JQUERY_NO_CONFLICT  = $.fn[NAME]
+  const CLASS_PREFIX        = 'bs-popover'
+  const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g')
 
   const Default = $.extend({}, Tooltip.Default, {
     placement : 'right',
@@ -107,6 +109,10 @@ const Popover = (($) => {
       return this.getTitle() || this._getContent()
     }
 
+    addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(`${CLASS_PREFIX}-${attachment}`)
+    }
+
     getTipElement() {
       return this.tip = this.tip || $(this.config.template)[0]
     }
@@ -130,6 +136,14 @@ const Popover = (($) => {
               this.config.content)
     }
 
+    _cleanTipClass() {
+      const $tip = $(this.getTipElement())
+      const tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX)
+      if (tabClass !== null && tabClass.length > 0) {
+        $tip.removeClass(tabClass.join(''))
+      }
+    }
+
 
     // static
 

diff --git a/js/src/tooltip.js b/js/src/tooltip.js
index 505a8d492abe9589fee86e59f52fcdb67c195c4f..fb4ff131c4b888afc7d7e16b945a4048491c708b 100644 (file)
--- a/js/src/tooltip.js
+++ b/js/src/tooltip.js
@@ -33,6 +33,8 @@ const Tooltip = (($) => {
   const EVENT_KEY           = `.${DATA_KEY}`
   const JQUERY_NO_CONFLICT  = $.fn[NAME]
   const TRANSITION_DURATION = 150
+  const CLASS_PREFIX        = 'bs-tooltip'
+  const BSCLS_PREFIX_REGEX = new RegExp(`(^|\\s)${CLASS_PREFIX}\\S+`, 'g')
 
   const Default = {
     animation   : true,
@@ -269,6 +271,7 @@ const Tooltip = (($) => {
           this.config.placement
 
         const attachment = this._getAttachment(placement)
+        this.addAttachmentClass(attachment)
 
         const container = this.config.container === false ? document.body : $(this.config.container)
 
@@ -332,6 +335,7 @@ const Tooltip = (($) => {
           tip.parentNode.removeChild(tip)
         }
 
+        this._cleanTipClass()
         this.element.removeAttribute('aria-describedby')
         $(this.element).trigger(this.constructor.Event.HIDDEN)
         if (this._popper !== null) {
@@ -383,6 +387,10 @@ const Tooltip = (($) => {
       return Boolean(this.getTitle())
     }
 
+    addAttachmentClass(attachment) {
+      $(this.getTipElement()).addClass(`${CLASS_PREFIX}-${attachment}`)
+    }
+
     getTipElement() {
       return this.tip = this.tip || $(this.config.template)[0]
     }
@@ -624,6 +632,14 @@ const Tooltip = (($) => {
       return config
     }
 
+  _cleanTipClass() {
+    const $tip = $(this.getTipElement())
+    const tabClass = $tip.attr('class').match(BSCLS_PREFIX_REGEX)
+    if (tabClass !== null && tabClass.length > 0) {
+      $tip.removeClass(tabClass.join(''))
+    }
+  }
+
 
     // static
 

diff --git a/js/tests/index.html b/js/tests/index.html
index 81efd5876d4e05f85e1e55d1ed7519d8ead54089..d17608e4a9c64e9149a9f54f6d8533aa9aab6e39 100644 (file)
--- a/js/tests/index.html
+++ b/js/tests/index.html
@@ -7,7 +7,7 @@
 
     <!-- jQuery -->
     <script src="../../docs/assets/js/vendor/jquery-slim.min.js"></script>
-    <script src="../../docs/assets/js/vendor/tether.min.js"></script>
+    <script src="../../docs/assets/js/vendor/popper.min.js"></script>
 
     <!-- QUnit -->
     <link rel="stylesheet" href="vendor/qunit.css" media="screen">

diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index 8cb1a6fdf19d2f03a01649b5f505eff0c64ff306..dc6364415a9439359b1b74252cedcd610ea6f49c 100644 (file)
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -111,7 +111,7 @@ $(function () {
 
     assert
       .ok($('.tooltip')
-      .is('.fade.bs-tether-element-attached-top.bs-tether-element-attached-center.show'), 'has correct classes applied')
+      .is('.fade.bs-tooltip-bottom.show'), 'has correct classes applied')
 
     $tooltip.bootstrapTooltip('hide')