Improvement: harmonize usage of constants (#30285)

js/src/button.js

@@ -25,6 +25,7 @@ const DATA_API_KEY = '.data-api'
 const ClassName = {
   ACTIVE: 'active',
   BUTTON: 'btn',
+  DISABLED: 'disabled',
   FOCUS: 'focus'
 }
 
@@ -89,8 +90,8 @@ class Button {
         if (triggerChangeEvent) {
           if (input.hasAttribute('disabled') ||
             rootElement.hasAttribute('disabled') ||
-            input.classList.contains('disabled') ||
-            rootElement.classList.contains('disabled')) {
+            input.classList.contains(ClassName.DISABLED) ||
+            rootElement.classList.contains(ClassName.DISABLED)) {
             return
           }
 

js/src/collapse.js

@@ -81,8 +81,8 @@ class Collapse {
     this._element = element
     this._config = this._getConfig(config)
     this._triggerArray = makeArray(SelectorEngine.find(
-      `[data-toggle="collapse"][href="#${element.id}"],` +
-      `[data-toggle="collapse"][data-target="#${element.id}"]`
+      `${Selector.DATA_TOGGLE}[href="#${element.id}"],` +
+      `${Selector.DATA_TOGGLE}[data-target="#${element.id}"]`
     ))
 
     const toggleList = makeArray(SelectorEngine.find(Selector.DATA_TOGGLE))
@@ -313,7 +313,7 @@ class Collapse {
       parent = SelectorEngine.findOne(parent)
     }
 
-    const selector = `[data-toggle="collapse"][data-parent="${parent}"]`
+    const selector = `${Selector.DATA_TOGGLE}[data-parent="${parent}"]`
 
     makeArray(SelectorEngine.find(selector, parent))
       .forEach(element => {

js/src/dropdown.js

@@ -57,6 +57,7 @@ const ClassName = {
   DROPRIGHT: 'dropright',
   DROPLEFT: 'dropleft',
   MENURIGHT: 'dropdown-menu-right',
+  NAVBAR: 'navbar',
   POSITION_STATIC: 'position-static'
 }
 
@@ -307,7 +308,7 @@ class Dropdown {
   }
 
   _detectNavbar() {
-    return Boolean(SelectorEngine.closest(this._element, '.navbar'))
+    return Boolean(SelectorEngine.closest(this._element, `.${ClassName.NAVBAR}`))
   }
 
   _getOffset() {

js/src/tooltip.js

@@ -109,6 +109,7 @@ const Event = {
 
 const ClassName = {
   FADE: 'fade',
+  MODAL: 'modal',
   SHOW: 'show'
 }
 
@@ -235,7 +236,7 @@ class Tooltip {
     Data.removeData(this.element, this.constructor.DATA_KEY)
 
     EventHandler.off(this.element, this.constructor.EVENT_KEY)
-    EventHandler.off(SelectorEngine.closest(this.element, '.modal'), 'hide.bs.modal', this._hideModalHandler)
+    EventHandler.off(SelectorEngine.closest(this.element, `.${ClassName.MODAL}`), 'hide.bs.modal', this._hideModalHandler)
 
     if (this.tip) {
       this.tip.parentNode.removeChild(this.tip)
@@ -565,7 +566,7 @@ class Tooltip {
       }
     }
 
-    EventHandler.on(SelectorEngine.closest(this.element, '.modal'),
+    EventHandler.on(SelectorEngine.closest(this.element, `.${ClassName.MODAL}`),
       'hide.bs.modal',
       this._hideModalHandler
     )