Refactor Modal.dispose and add test

js/src/modal.js

@@ -81,6 +81,7 @@ class Modal {
     this._isShown             = false
     this._isBodyOverflowing   = false
     this._ignoreBackdropClick = false
+    this._isTransitioning     = false
     this._scrollbarWidth      = 0
   }
 
@@ -101,7 +102,7 @@ class Modal {
   }
 
   show(relatedTarget) {
-    if (this._isTransitioning || this._isShown) {
+    if (this._isShown || this._isTransitioning) {
       return
     }
 
@@ -153,7 +154,7 @@ class Modal {
       event.preventDefault()
     }
 
-    if (this._isTransitioning || !this._isShown) {
+    if (!this._isShown || this._isTransitioning) {
       return
     }
 
@@ -195,9 +196,17 @@ class Modal {
   }
 
   dispose() {
-    $.removeData(this._element, DATA_KEY)
+    [window, this._element, this._dialog]
+      .forEach((htmlElement) => $(htmlElement).off(EVENT_KEY))
+
+    /**
+     * `document` has 2 events `Event.FOCUSIN` and `Event.CLICK_DATA_API`
+     * Do not move `document` in `htmlElements` array
+     * It will remove `Event.CLICK_DATA_API` event that should remain
+     */
+    $(document).off(Event.FOCUSIN)
 
-    $(window, document, this._element, this._backdrop).off(EVENT_KEY)
+    $.removeData(this._element, DATA_KEY)
 
     this._config              = null
     this._element             = null
@@ -206,6 +215,7 @@ class Modal {
     this._isShown             = null
     this._isBodyOverflowing   = null
     this._ignoreBackdropClick = null
+    this._isTransitioning     = null
     this._scrollbarWidth      = null
   }
 

js/tests/unit/modal.js

@@ -697,4 +697,37 @@ $(function () {
 
     beginTimestamp = Date.now()
   })
+
+  QUnit.test('should dispose modal', function (assert) {
+    assert.expect(3)
+    var done = assert.async()
+
+    var $modal = $([
+      '<div id="modal-test">',
+      '  <div class="modal-dialog">',
+      '    <div class="modal-content">',
+      '      <div class="modal-body" />',
+      '    </div>',
+      '  </div>',
+      '</div>'
+    ].join('')).appendTo('#qunit-fixture')
+
+    $modal.on('shown.bs.modal', function () {
+      var spy = sinon.spy($.fn, 'off')
+
+      $(this).bootstrapModal('dispose')
+
+      const modalDataApiEvent = $._data(document, 'events').click
+        .find((e) => e.namespace === 'bs.data-api.modal')
+
+      assert.ok(typeof $(this).data('bs.modal') === 'undefined', 'modal data object was disposed')
+
+      assert.ok(spy.callCount === 4, '`jQuery.off` was called')
+
+      assert.ok(typeof modalDataApiEvent !== 'undefined', '`Event.CLICK_DATA_API` on `document` was not removed')
+
+      $.fn.off.restore()
+      done()
+    }).bootstrapModal('show')
+  })
 })