Rewritten modal without jquery (#23955)

* Trigger jquery events if available in event handler

* Rewritten modal without jquery

1 files changed, 29 insertions, 20 deletions

diff --git a/js/tests/unit/modal.js b/js/tests/unit/modal.js
index 9b7fb0aa6..cfac27bba 100644
--- a/js/tests/unit/modal.js
+++ b/js/tests/unit/modal.js
@@ -209,9 +209,12 @@ $(function () {
       .on('shown.bs.modal', function () {
         assert.ok($('#modal-test').length, 'modal inserted into dom')
         assert.ok($('#modal-test').is(':visible'), 'modal visible')
-        $div.trigger($.Event('keydown', {
-          which: 27
-        }))
+
+        var evt = document.createEvent('HTMLEvents')
+        evt.initEvent('keydown', true, true)
+        evt.which = 27
+
+        $div[0].dispatchEvent(evt)
 
         setTimeout(function () {
           assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
@@ -308,15 +311,19 @@ $(function () {
       .one('hidden.bs.modal', function () {
         // After one open-close cycle
         assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
-        $(this)
-          .one('shown.bs.modal', function () {
-            $('#close').trigger('click')
-          })
-          .one('hidden.bs.modal', function () {
-            assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
-            done()
-          })
-          .bootstrapModal('show')
+
+        var $this = $(this)
+        setTimeout(function () {
+          $this
+            .one('shown.bs.modal', function () {
+              $('#close').trigger('click')
+            })
+            .one('hidden.bs.modal', function () {
+              assert.ok(!$('#modal-test').is(':visible'), 'modal hidden')
+              done()
+            })
+            .bootstrapModal('show')
+        }, 0)
       })
       .bootstrapModal('show')
   })
@@ -595,7 +602,6 @@ $(function () {
 
   QUnit.test('should not follow link in area tag', function (assert) {
     assert.expect(2)
-    var done = assert.async()
 
     $('<map><area id="test" shape="default" data-toggle="modal" data-target="#modal-test" href="demo.html"/></map>')
       .appendTo('#qunit-fixture')
@@ -603,16 +609,19 @@ $(function () {
     $('<div id="modal-test"><div class="contents"><div id="close" data-dismiss="modal"/></div></div>')
       .appendTo('#qunit-fixture')
 
+    // We need to use CustomEvent here to have a working preventDefault in IE tests.
+    var evt = new CustomEvent('click', {
+      bubbles: true,
+      cancelable: true
+    })
+
     $('#test')
       .on('click.bs.modal.data-api', function (event) {
-        assert.notOk(event.isDefaultPrevented(), 'navigating to href will happen')
-
-        setTimeout(function () {
-          assert.ok(event.isDefaultPrevented(), 'model shown instead of navigating to href')
-          done()
-        }, 1)
+        assert.notOk(event.defaultPrevented, 'navigating to href will happen')
       })
-      .trigger('click')
+
+    $('#test')[0].dispatchEvent(evt)
+    assert.ok(evt.defaultPrevented, 'model shown instead of navigating to href')
   })
 
   QUnit.test('should not parse target as html', function (assert) {