Modal: refactor listeners to reduce some code noise (#35902)

diff --git a/js/src/modal.js b/js/src/modal.js
index 054750c5f7fdba8bc3331b4e957c0b0d781aa4f7..ea8e0a0463b70df75f9ff5b520d3045a189190fc 100644 (file)
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -69,6 +69,8 @@ class Modal extends BaseComponent {
     this._isShown = false
     this._isTransitioning = false
     this._scrollBar = new ScrollBarHelper()
+
+    this._addEventListeners()
   }
 
   // Getters
@@ -111,9 +113,6 @@ class Modal extends BaseComponent {
 
     this._adjustDialog()
 
-    this._toggleEscapeEventListener(true)
-    this._toggleResizeEventListener(true)
-
     this._backdrop.show(() => this._showElement(relatedTarget))
   }
 
@@ -130,10 +129,6 @@ class Modal extends BaseComponent {
 
     this._isShown = false
     this._isTransitioning = true
-
-    this._toggleEscapeEventListener(false)
-    this._toggleResizeEventListener(false)
-
     this._focustrap.deactivate()
 
     this._element.classList.remove(CLASS_NAME_SHOW)
@@ -217,12 +212,7 @@ class Modal extends BaseComponent {
     this._queueCallback(transitionComplete, this._dialog, this._isAnimated())
   }
 
-  _toggleEscapeEventListener(enable) {
-    if (!enable) {
-      EventHandler.off(this._element, EVENT_KEYDOWN_DISMISS)
-      return
-    }
-
+  _addEventListeners() {
     EventHandler.on(this._element, EVENT_KEYDOWN_DISMISS, event => {
       if (event.key !== ESCAPE_KEY) {
         return
@@ -236,15 +226,12 @@ class Modal extends BaseComponent {
 
       this._triggerBackdropTransition()
     })
-  }
-
-  _toggleResizeEventListener(enable) {
-    if (enable) {
-      EventHandler.on(window, EVENT_RESIZE, () => this._adjustDialog())
-      return
-    }
 
-    EventHandler.off(window, EVENT_RESIZE)
+    EventHandler.on(window, EVENT_RESIZE, () => {
+      if (this._isShown && !this._isTransitioning) {
+        this._adjustDialog()
+      }
+    })
   }
 
   _hideModal() {

diff --git a/js/tests/unit/modal.spec.js b/js/tests/unit/modal.spec.js
index a04eb2cc2c5961f625c201f386e8855bf6bd9ec3..bf26377fe87fdd93438a8401147d6331e4358965 100644 (file)
--- a/js/tests/unit/modal.spec.js
+++ b/js/tests/unit/modal.spec.js
@@ -438,10 +438,10 @@ describe('Modal', () => {
         const modalEl = fixtureEl.querySelector('.modal')
         const modal = new Modal(modalEl)
 
-        spyOn(modal, '_adjustDialog').and.callThrough()
+        const spy = spyOn(modal, '_adjustDialog').and.callThrough()
 
         const expectDone = () => {
-          expect(modal._adjustDialog).toHaveBeenCalled()
+          expect(spy).toHaveBeenCalled()
 
           resolve()
         }