modal: move common code to a new `isAnimated` method (#33056)

1 files changed, 17 insertions, 16 deletions

diff --git a/js/src/modal.js b/js/src/modal.js
index 332d636d0f..40fd226bf6 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -113,7 +113,7 @@ class Modal extends BaseComponent {
       return
     }
 
-    if (this._element.classList.contains(CLASS_NAME_FADE)) {
+    if (this._isAnimated()) {
       this._isTransitioning = true
     }
 
@@ -164,9 +164,9 @@ class Modal extends BaseComponent {
     }
 
     this._isShown = false
-    const transition = this._element.classList.contains(CLASS_NAME_FADE)
+    const isAnimated = this._isAnimated()
 
-    if (transition) {
+    if (isAnimated) {
       this._isTransitioning = true
     }
 
@@ -180,7 +180,7 @@ class Modal extends BaseComponent {
     EventHandler.off(this._element, EVENT_CLICK_DISMISS)
     EventHandler.off(this._dialog, EVENT_MOUSEDOWN_DISMISS)
 
-    if (transition) {
+    if (isAnimated) {
       const transitionDuration = getTransitionDurationFromElement(this._element)
 
       EventHandler.one(this._element, 'transitionend', event => this._hideModal(event))
@@ -229,7 +229,7 @@ class Modal extends BaseComponent {
   }
 
   _showElement(relatedTarget) {
-    const transition = this._element.classList.contains(CLASS_NAME_FADE)
+    const isAnimated = this._isAnimated()
     const modalBody = SelectorEngine.findOne(SELECTOR_MODAL_BODY, this._dialog)
 
     if (!this._element.parentNode || this._element.parentNode.nodeType !== Node.ELEMENT_NODE) {
@@ -247,7 +247,7 @@ class Modal extends BaseComponent {
       modalBody.scrollTop = 0
     }
 
-    if (transition) {
+    if (isAnimated) {
       reflow(this._element)
     }
 
@@ -268,7 +268,7 @@ class Modal extends BaseComponent {
       })
     }
 
-    if (transition) {
+    if (isAnimated) {
       const transitionDuration = getTransitionDurationFromElement(this._dialog)
 
       EventHandler.one(this._dialog, 'transitionend', transitionComplete)
@@ -332,16 +332,13 @@ class Modal extends BaseComponent {
   }
 
   _showBackdrop(callback) {
-    const animate = this._element.classList.contains(CLASS_NAME_FADE) ?
-      CLASS_NAME_FADE :
-      ''
-
+    const isAnimated = this._isAnimated()
     if (this._isShown && this._config.backdrop) {
       this._backdrop = document.createElement('div')
       this._backdrop.className = CLASS_NAME_BACKDROP
 
-      if (animate) {
-        this._backdrop.classList.add(animate)
+      if (isAnimated) {
+        this._backdrop.classList.add(CLASS_NAME_FADE)
       }
 
       document.body.appendChild(this._backdrop)
@@ -363,13 +360,13 @@ class Modal extends BaseComponent {
         }
       })
 
-      if (animate) {
+      if (isAnimated) {
         reflow(this._backdrop)
       }
 
       this._backdrop.classList.add(CLASS_NAME_SHOW)
 
-      if (!animate) {
+      if (!isAnimated) {
         callback()
         return
       }
@@ -386,7 +383,7 @@ class Modal extends BaseComponent {
         callback()
       }
 
-      if (this._element.classList.contains(CLASS_NAME_FADE)) {
+      if (isAnimated) {
         const backdropTransitionDuration = getTransitionDurationFromElement(this._backdrop)
         EventHandler.one(this._backdrop, 'transitionend', callbackRemove)
         emulateTransitionEnd(this._backdrop, backdropTransitionDuration)
@@ -398,6 +395,10 @@ class Modal extends BaseComponent {
     }
   }
 
+  _isAnimated() {
+    return this._element.classList.contains(CLASS_NAME_FADE)
+  }
+
   _triggerBackdropTransition() {
     const hideEvent = EventHandler.trigger(this._element, EVENT_HIDE_PREVENTED)
     if (hideEvent.defaultPrevented) {