test(Modal): check if modal is disposed

2 files changed, 43 insertions, 2 deletions

diff --git a/js/src/modal.js b/js/src/modal.js
index 704b022472..0004fe8bbe 100644
--- a/js/src/modal.js
+++ b/js/src/modal.js
@@ -196,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
diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js
index 7c8299109e..4c857105b8 100644
--- a/js/tests/unit/modal.js
+++ b/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')
+  })
 })