fix(event-handler): remove the use of our event handler in unit test

9 files changed, 303 insertions, 280 deletions

diff --git a/js/tests/unit/alert.js b/js/tests/unit/alert.js
index d5437a737..17d7be01e 100644
--- a/js/tests/unit/alert.js
+++ b/js/tests/unit/alert.js
@@ -45,7 +45,7 @@ $(function () {
     var $alert = $(alertHTML).bootstrapAlert().appendTo($('#qunit-fixture'))
 
     var closeBtn = $alert.find('.close')[0]
-    EventHandler.trigger(closeBtn, 'click')
+    closeBtn.dispatchEvent(new Event('click'))
     assert.strictEqual($alert.hasClass('show'), false, 'remove .show class on .close click')
   })
 
@@ -60,13 +60,13 @@ $(function () {
 
     assert.notEqual($('#qunit-fixture').find('.alert').length, 0, 'element added to dom')
 
-    EventHandler.on($alert[0], 'closed.bs.alert', function () {
+    $alert[0].addEventListener('closed.bs.alert', function () {
       assert.strictEqual($('#qunit-fixture').find('.alert').length, 0, 'element removed from dom')
       done()
     })
 
     var closeBtn = $alert.find('.close')[0]
-    EventHandler.trigger(closeBtn, 'click')
+    closeBtn.dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not fire closed when close is prevented', function (assert) {
@@ -75,12 +75,12 @@ $(function () {
     var $alert = $('<div class="alert"/>')
     $alert.appendTo('#qunit-fixture')
 
-    EventHandler.on($alert[0], 'close.bs.alert', function (e) {
+    $alert[0].addEventListener('close.bs.alert', function (e) {
       e.preventDefault()
       assert.ok(true, 'close event fired')
       done()
     })
-    EventHandler.on($alert[0], 'closed.bs.alert', function () {
+    $alert[0].addEventListener('closed.bs.alert', function () {
       assert.ok(false, 'closed event fired')
     })
 
@@ -95,7 +95,7 @@ $(function () {
     var $alert = $el.bootstrapAlert()
     var alertInstance = Alert._getInstance($alert[0])
 
-    $alert.one('closed.bs.alert', function () {
+    $alert[0].addEventListener('closed.bs.alert', function () {
       assert.ok('alert closed')
       done()
     })
diff --git a/js/tests/unit/button.js b/js/tests/unit/button.js
index 50b531f6f..e116730c2 100644
--- a/js/tests/unit/button.js
+++ b/js/tests/unit/button.js
@@ -125,25 +125,26 @@ $(function () {
 
     var $btn1 = $group.children().eq(0)
     var $btn2 = $group.children().eq(1)
+    var inputBtn2 = $btn2.find('input')[0]
 
     assert.ok($btn1.hasClass('active'), 'btn1 has active class')
     assert.ok($btn1.find('input').prop('checked'), 'btn1 is checked')
     assert.ok(!$btn2.hasClass('active'), 'btn2 does not have active class')
-    assert.ok(!Manipulator.isChecked($btn2.find('input')[0]), 'btn2 is not checked')
+    assert.ok(!(inputBtn2.bsChecked || inputBtn2.checked), 'btn2 is not checked')
 
-    EventHandler.trigger($btn2.find('input')[0], 'click')
+    inputBtn2.dispatchEvent(new Event('click'))
 
     assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
     assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked')
     assert.ok($btn2.hasClass('active'), 'btn2 has active class')
-    assert.ok(Manipulator.isChecked($btn2.find('input')[0]), 'btn2 is checked')
+    assert.ok(inputBtn2.bsChecked || inputBtn2.checked, 'btn2 is checked')
 
-    EventHandler.trigger($btn2.find('input')[0], 'click') // clicking an already checked radio should not un-check it
+    inputBtn2.dispatchEvent(new Event('click')) // clicking an already checked radio should not un-check it
 
     assert.ok(!$btn1.hasClass('active'), 'btn1 does not have active class')
     assert.ok(!$btn1.find('input').prop('checked'), 'btn1 is not checked')
     assert.ok($btn2.hasClass('active'), 'btn2 has active class')
-    assert.ok(Manipulator.isChecked($btn2.find('input')[0]), 'btn2 is checked')
+    assert.ok(inputBtn2.bsChecked || inputBtn2.checked, 'btn2 is checked')
   })
 
   QUnit.test('should only toggle selectable inputs', function (assert) {
diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js
index f89dfcf96..6533454a6 100644
--- a/js/tests/unit/carousel.js
+++ b/js/tests/unit/carousel.js
@@ -116,12 +116,12 @@ $(function () {
     var $carousel = $('<div class="carousel"/>')
     $carousel.appendTo('#qunit-fixture')
 
-    EventHandler.on($carousel[0], 'slide.bs.carousel', function (e) {
+    $carousel[0].addEventListener('slide.bs.carousel', function (e) {
       e.preventDefault()
       assert.ok(true, 'slide event fired')
       done()
     })
-    EventHandler.on($carousel[0], 'slid.bs.carousel', function () {
+    $carousel[0].addEventListener('slid.bs.carousel', function () {
       assert.ok(false, 'slid event fired')
     })
     $carousel.bootstrapCarousel('next')
@@ -153,26 +153,28 @@ $(function () {
     $carousel.appendTo('#qunit-fixture')
 
     var done = assert.async()
-    EventHandler
-      .one($carousel[0], 'slide.bs.carousel', function (e) {
-        e.preventDefault()
-        setTimeout(function () {
-          assert.ok($carousel.find('.carousel-item:nth-child(1)').is('.active'), 'first item still active')
-          assert.ok($carousel.find('.carousel-indicators li:nth-child(1)').is('.active'), 'first indicator still active')
-          $carousel.bootstrapCarousel('next')
-        }, 0)
-      })
-
-    EventHandler
-      .one($carousel[0], 'slid.bs.carousel', function () {
-        setTimeout(function () {
-          assert.ok(!$carousel.find('.carousel-item:nth-child(1)').is('.active'), 'first item still active')
-          assert.ok(!$carousel.find('.carousel-indicators li:nth-child(1)').is('.active'), 'first indicator still active')
-          assert.ok($carousel.find('.carousel-item:nth-child(2)').is('.active'), 'second item active')
-          assert.ok($carousel.find('.carousel-indicators li:nth-child(2)').is('.active'), 'second indicator active')
-          done()
-        }, 0)
-      })
+    function onSlide(e) {
+      e.preventDefault()
+      setTimeout(function () {
+        assert.ok($carousel.find('.carousel-item:nth-child(1)').is('.active'), 'first item still active')
+        assert.ok($carousel.find('.carousel-indicators li:nth-child(1)').is('.active'), 'first indicator still active')
+        $carousel.bootstrapCarousel('next')
+      }, 0)
+      $carousel[0].removeEventListener('slide.bs.carousel', onSlide)
+    }
+    $carousel[0].addEventListener('slide.bs.carousel', onSlide)
+
+    function onSlid() {
+      setTimeout(function () {
+        assert.ok(!$carousel.find('.carousel-item:nth-child(1)').is('.active'), 'first item still active')
+        assert.ok(!$carousel.find('.carousel-indicators li:nth-child(1)').is('.active'), 'first indicator still active')
+        assert.ok($carousel.find('.carousel-item:nth-child(2)').is('.active'), 'second item active')
+        assert.ok($carousel.find('.carousel-indicators li:nth-child(2)').is('.active'), 'second indicator active')
+        done()
+      }, 0)
+      $carousel[0].removeEventListener('slid.bs.carousel', onSlid)
+    }
+    $carousel[0].addEventListener('slid.bs.carousel', onSlid)
 
     $carousel.bootstrapCarousel('next')
   })
@@ -217,19 +219,22 @@ $(function () {
 
     var done = assert.async()
 
-    EventHandler
-      .one($carousel[0], 'slide.bs.carousel', function (e) {
-        assert.ok(e.direction, 'direction present on next')
-        assert.strictEqual(e.direction, 'left', 'direction is left on next')
-
-        EventHandler
-          .one($carousel[0], 'slide.bs.carousel', function (e) {
-            assert.ok(e.direction, 'direction present on prev')
-            assert.strictEqual(e.direction, 'right', 'direction is right on prev')
-            done()
-          })
-        $carousel.bootstrapCarousel('prev')
-      })
+    function onSlide(e) {
+      assert.ok(e.direction, 'direction present on next')
+      assert.strictEqual(e.direction, 'left', 'direction is left on next')
+
+      $carousel[0].addEventListener('slide.bs.carousel', onSlide2)
+      $carousel[0].removeEventListener('slide.bs.carousel', onSlide)
+      $carousel.bootstrapCarousel('prev')
+    }
+
+    function onSlide2(e) {
+      assert.ok(e.direction, 'direction present on prev')
+      assert.strictEqual(e.direction, 'right', 'direction is right on prev')
+      done()
+    }
+
+    $carousel[0].addEventListener('slide.bs.carousel', onSlide)
     $carousel.bootstrapCarousel('next')
   })
 
@@ -273,19 +278,23 @@ $(function () {
 
     var done = assert.async()
 
-    EventHandler
-      .one($carousel[0], 'slid.bs.carousel', function (e) {
-        assert.ok(e.direction, 'direction present on next')
-        assert.strictEqual(e.direction, 'left', 'direction is left on next')
-
-        EventHandler
-          .one($carousel[0], 'slid.bs.carousel', function (e) {
-            assert.ok(e.direction, 'direction present on prev')
-            assert.strictEqual(e.direction, 'right', 'direction is right on prev')
-            done()
-          })
-        $carousel.bootstrapCarousel('prev')
-      })
+    function onSlid(e) {
+      assert.ok(e.direction, 'direction present on next')
+      assert.strictEqual(e.direction, 'left', 'direction is left on next')
+
+      $carousel[0].addEventListener('slid.bs.carousel', onSlid2)
+      $carousel[0].removeEventListener('slid.bs.carousel', onSlid)
+      $carousel.bootstrapCarousel('prev')
+    }
+
+    function onSlid2(e) {
+      assert.ok(e.direction, 'direction present on prev')
+      assert.strictEqual(e.direction, 'right', 'direction is right on prev')
+      $carousel[0].removeEventListener('slid.bs.carousel', onSlid2)
+      done()
+    }
+
+    $carousel[0].addEventListener('slid.bs.carousel', onSlid)
     $carousel.bootstrapCarousel('next')
   })
 
@@ -329,13 +338,14 @@ $(function () {
     var $carousel = $(template)
     $carousel.appendTo('#qunit-fixture')
 
-    EventHandler
-      .one($carousel[0], 'slide.bs.carousel', function (e) {
-        assert.ok(e.relatedTarget, 'relatedTarget present')
-        assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"')
-        done()
-      })
+    function onSlide(e) {
+      assert.ok(e.relatedTarget, 'relatedTarget present')
+      assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"')
+      $carousel[0].removeEventListener('slide.bs.carousel', onSlide)
+      done()
+    }
 
+    $carousel[0].addEventListener('slide.bs.carousel', onSlide)
     $carousel.bootstrapCarousel('next')
   })
 
@@ -379,12 +389,11 @@ $(function () {
     var $carousel = $(template)
     $carousel.appendTo('#qunit-fixture')
 
-    EventHandler
-      .one($carousel[0], 'slid.bs.carousel', function (e) {
-        assert.ok(e.relatedTarget, 'relatedTarget present')
-        assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"')
-        done()
-      })
+    $carousel[0].addEventListener('slid.bs.carousel', function (e) {
+      assert.ok(e.relatedTarget, 'relatedTarget present')
+      assert.ok($(e.relatedTarget).hasClass('carousel-item'), 'relatedTarget has class "item"')
+      done()
+    })
 
     $carousel.bootstrapCarousel('next')
   })
@@ -419,18 +428,16 @@ $(function () {
     var done = assert.async()
     var $carousel = $(template)
 
-    EventHandler
-      .one($carousel[0], 'slid.bs.carousel', function (e) {
-        assert.ok(typeof e.from !== 'undefined', 'from present')
-        assert.ok(typeof e.to !== 'undefined', 'to present')
-        done()
-      })
+    $carousel[0].addEventListener('slid.bs.carousel', function (e) {
+      assert.ok(typeof e.from !== 'undefined', 'from present')
+      assert.ok(typeof e.to !== 'undefined', 'to present')
+      done()
+    })
 
-    EventHandler
-      .one($carousel[0], 'slide.bs.carousel', function (e) {
-        assert.ok(typeof e.from !== 'undefined', 'from present')
-        assert.ok(typeof e.to !== 'undefined', 'to present')
-      })
+    $carousel[0].addEventListener('slide.bs.carousel', function (e) {
+      assert.ok(typeof e.from !== 'undefined', 'from present')
+      assert.ok(typeof e.to !== 'undefined', 'to present')
+    })
 
     $carousel.bootstrapCarousel('next')
   })
@@ -474,19 +481,20 @@ $(function () {
     $carousel.attr('data-interval', 1814)
 
     $carousel.appendTo('body')
-    EventHandler.trigger($('[data-slide]').first()[0], 'click')
+    $('[data-slide]').first()[0].dispatchEvent(new Event('click'))
     assert.strictEqual(Carousel._getInstance($carousel[0])._config.interval, 1814)
     $carousel.remove()
 
     $carousel.appendTo('body').attr('data-modal', 'foobar')
-    EventHandler.trigger($('[data-slide]').first()[0], 'click')
+    $('[data-slide]').first()[0].dispatchEvent(new Event('click'))
     assert.strictEqual(Carousel._getInstance($carousel[0])._config.interval, 1814, 'even if there is an data-modal attribute set')
     $carousel.remove()
 
     $carousel.appendTo('body')
-    EventHandler.trigger($('[data-slide]').first()[0], 'click')
+    $('[data-slide]').first()[0].dispatchEvent(new Event('click'))
     $carousel.attr('data-interval', 1860)
-    EventHandler.trigger($('[data-slide]').first()[0], 'click')
+
+    $('[data-slide]').first()[0].dispatchEvent(new Event('click'))
     assert.strictEqual(Carousel._getInstance($carousel[0])._config.interval, 1814, 'attributes should be read only on initialization')
     $carousel.bootstrapCarousel('dispose')
     $carousel.remove()
@@ -619,9 +627,9 @@ $(function () {
 
     assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
 
-    EventHandler.trigger($template[0], 'keydown', {
-      which: 37
-    })
+    var keyDown = new Event('keydown')
+    keyDown.which = 37
+    $template[0].dispatchEvent(keyDown)
 
     assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
   })
@@ -647,9 +655,9 @@ $(function () {
 
     assert.strictEqual($template.find('.carousel-item')[0], $template.find('.active')[0], 'first item active')
 
-    EventHandler.trigger($template[0], 'keydown', {
-      which: 39
-    })
+    var keyDown = new Event('keydown')
+    keyDown.which = 39
+    $template[0].dispatchEvent(keyDown)
 
     assert.strictEqual($template.find('.carousel-item')[1], $template.find('.active')[0], 'second item active')
   })
@@ -668,24 +676,28 @@ $(function () {
     $template.bootstrapCarousel()
     var done = assert.async()
 
-    EventHandler.one($template[0], 'keydown', function (event) {
+    function handlerKeydown() {
       assert.strictEqual(event.defaultPrevented, false)
-    })
+      $template[0].removeEventListener('keydown', handlerKeydown)
+    }
+    $template[0].addEventListener('keydown', handlerKeydown)
 
     // arrow down
-    EventHandler.trigger($template[0], 'keydown', {
-      which: 40
-    })
+    var keyDown = new Event('keydown')
+    keyDown.which = 40
+    $template[0].dispatchEvent(keyDown)
 
-    EventHandler.one($template[0], 'keydown', function (event) {
+    function handlerKeydown2() {
       assert.strictEqual(event.defaultPrevented, false)
+      $template[0].addEventListener('keydown', handlerKeydown2)
       done()
-    })
+    }
+    $template[0].addEventListener('keydown', handlerKeydown2)
 
     // arrow up
-    EventHandler.trigger($template[0], 'keydown', {
-      which: 38
-    })
+    var keyDown2 = new Event('keydown')
+    keyDown2.which = 38
+    $template[0].dispatchEvent(keyDown2)
   })
 
   QUnit.test('should support disabling the keyboard navigation', function (assert) {
@@ -794,25 +806,29 @@ $(function () {
         '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>' +
         '</div>'
     var $carousel = $(carouselHTML)
+    var done = assert.async()
     var getActiveId = function () {
       return $carousel.find('.carousel-item.active').attr('id')
     }
 
-    var done = assert.async()
-
-    EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
-      assert.strictEqual(getActiveId(), 'two', 'carousel slid from 1st to 2nd slide')
-
-      EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
-        assert.strictEqual(getActiveId(), 'three', 'carousel slid from 2nd to 3rd slide')
+    $carousel[0].addEventListener('slid.bs.carousel', function () {
+      var activeId = getActiveId()
+      if (activeId === 'two') {
+        assert.strictEqual(activeId, 'two', 'carousel slid from 1st to 2nd slide')
+        $carousel.bootstrapCarousel('next')
+        return
+      }
 
-        EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
-          assert.strictEqual(getActiveId(), 'one', 'carousel wrapped around and slid from 3rd to 1st slide')
-          done()
-        })
+      if (activeId === 'three') {
+        assert.strictEqual(activeId, 'three', 'carousel slid from 2nd to 3rd slide')
         $carousel.bootstrapCarousel('next')
-      })
-      $carousel.bootstrapCarousel('next')
+        return
+      }
+
+      if (activeId === 'one') {
+        assert.strictEqual(activeId, 'one', 'carousel wrapped around and slid from 3rd to 1st slide')
+        done()
+      }
     })
     $carousel.bootstrapCarousel('next')
   })
@@ -843,7 +859,7 @@ $(function () {
 
     var done = assert.async()
 
-    EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
+    $carousel[0].addEventListener('slid.bs.carousel', function () {
       assert.strictEqual($carousel.find('.carousel-item.active').attr('id'), 'three', 'carousel wrapped around and slid from 1st to 3rd slide')
       done()
     })
@@ -872,27 +888,26 @@ $(function () {
         '<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev"/>' +
         '<a class="right carousel-control" href="#carousel-example-generic" data-slide="next"/>' +
         '</div>'
-    var $carousel = $(carouselHTML)
+    var $carousel = $(carouselHTML).appendTo('#qunit-fixture')
     var getActiveId = function () {
       return $carousel.find('.carousel-item.active').attr('id')
     }
 
     var done = assert.async()
+    $carousel[0].addEventListener('slid.bs.carousel', function () {
+      var activeId = getActiveId()
+      if (activeId === 'two') {
+        assert.strictEqual(activeId, 'two', 'carousel slid from 1st to 2nd slide')
+        $carousel.bootstrapCarousel('next')
+        return
+      }
 
-    EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
-      assert.strictEqual(getActiveId(), 'two', 'carousel slid from 1st to 2nd slide')
-
-      EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
-        assert.strictEqual(getActiveId(), 'three', 'carousel slid from 2nd to 3rd slide')
-
-        EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
-          assert.ok(false, 'carousel slid when it should not have slid')
-        })
+      if (activeId === 'three') {
+        assert.strictEqual(activeId, 'three', 'carousel slid from 2nd to 3rd slide')
         $carousel.bootstrapCarousel('next')
         assert.strictEqual(getActiveId(), 'three', 'carousel did not wrap around and stayed on 3rd slide')
         done()
-      })
-      $carousel.bootstrapCarousel('next')
+      }
     })
     $carousel.bootstrapCarousel('next')
   })
@@ -921,7 +936,7 @@ $(function () {
         '</div>'
     var $carousel = $(carouselHTML)
 
-    EventHandler.one($carousel[0], 'slid.bs.carousel', function () {
+    $carousel[0].addEventListener('slid.bs.carousel', function () {
       assert.ok(false, 'carousel slid when it should not have slid')
     })
     $carousel.bootstrapCarousel('prev')
diff --git a/js/tests/unit/collapse.js b/js/tests/unit/collapse.js
index 66cf6af96..bb11645b2 100644
--- a/js/tests/unit/collapse.js
+++ b/js/tests/unit/collapse.js
@@ -73,7 +73,7 @@ $(function () {
       assert.ok(!/height/i.test($el2.attr('style')), 'has height reset')
       done()
     })
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should collapse only the first collapse', function (assert) {
@@ -167,7 +167,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should add "collapsed" class to target when collapse is hidden', function (assert) {
@@ -183,7 +183,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should remove "collapsed" class from all triggers targeting the collapse when the collapse is shown', function (assert) {
@@ -201,7 +201,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should add "collapsed" class to all triggers targeting the collapse when the collapse is hidden', function (assert) {
@@ -219,7 +219,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not close a collapse when initialized with "show" option if already shown', function (assert) {
@@ -311,7 +311,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target3[0], 'click')
+    $target3[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should allow dots in data-parent', function (assert) {
@@ -345,7 +345,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target3[0], 'click')
+    $target3[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should set aria-expanded="true" on trigger/control when collapse is shown', function (assert) {
@@ -361,7 +361,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should set aria-expanded="false" on trigger/control when collapse is hidden', function (assert) {
@@ -377,7 +377,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should set aria-expanded="true" on all triggers targeting the collapse when the collapse is shown', function (assert) {
@@ -395,7 +395,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should set aria-expanded="false" on all triggers targeting the collapse when the collapse is hidden', function (assert) {
@@ -413,7 +413,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target[0], 'click')
+    $target[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should change aria-expanded from active accordion trigger/control to "false" and set the trigger/control for the newly active one to "true"', function (assert) {
@@ -447,7 +447,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($target3[0], 'click')
+    $target3[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not fire show event if show is prevented because other element is still transitioning', function (assert) {
@@ -472,12 +472,12 @@ $(function () {
     var $target2 = $('<a role="button" data-toggle="collapse" href="#body2"/>').appendTo($groups.eq(1))
     var $body2   = $('<div id="body2" class="collapse" data-parent="#accordion"/>').appendTo($groups.eq(1))
 
-    EventHandler.trigger($target2[0], 'click')
+    $target2[0].dispatchEvent(new Event('click'))
 
     $body2.toggleClass('show collapsing')
     Collapse._getInstance($body2[0])._isTransitioning = true
 
-    EventHandler.trigger($target1[0], 'click')
+    $target1[0].dispatchEvent(new Event('click'))
 
     setTimeout(function () {
       assert.ok(!showFired, 'show event did not fire')
@@ -542,9 +542,9 @@ $(function () {
         assert.ok($collapseTwo.hasClass('show'), '#collapseTwo is shown')
         done()
       })
-      EventHandler.trigger($triggerTwo[0], 'click')
+      $triggerTwo[0].dispatchEvent(new Event('click'))
     })
-    EventHandler.trigger($trigger[0], 'click')
+    $trigger[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should allow accordion to contain nested elements', function (assert) {
@@ -582,9 +582,9 @@ $(function () {
         assert.ok($collapseTwo.hasClass('show'), '#collapseTwo is shown')
         done()
       })
-      EventHandler.trigger($triggerTwo[0], 'click')
+      $triggerTwo[0].dispatchEvent(new Event('click'))
     })
-    EventHandler.trigger($trigger[0], 'click')
+    $trigger[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should allow accordion to target multiple elements', function (assert) {
@@ -616,7 +616,7 @@ $(function () {
       assert.ok($collapseOneTwo.hasClass('show'), '#collapseOneTwo is shown')
       assert.ok(!$collapseTwoOne.hasClass('show'), '#collapseTwoOne is not shown')
       assert.ok(!$collapseTwoTwo.hasClass('show'), '#collapseTwoTwo is not shown')
-      EventHandler.trigger($triggerTwo[0], 'click')
+      $triggerTwo[0].dispatchEvent(new Event('click'))
     }
 
     function secondTest() {
@@ -659,7 +659,7 @@ $(function () {
       }
     })
 
-    EventHandler.trigger($trigger[0], 'click')
+    $trigger[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should collapse accordion children but not nested accordion children', function (assert) {
@@ -690,26 +690,33 @@ $(function () {
     var $collapseTwo = $('#collapseTwo')
     var $nestedCollapseOne = $('#nestedCollapseOne')
 
-    EventHandler.one($collapseOne[0], 'shown.bs.collapse', function () {
+    function handlerCollapseOne() {
       assert.ok($collapseOne.hasClass('show'), '#collapseOne is shown')
       assert.ok(!$collapseTwo.hasClass('show'), '#collapseTwo is not shown')
       assert.ok(!$('#nestedCollapseOne').hasClass('show'), '#nestedCollapseOne is not shown')
 
-      EventHandler.one($nestedCollapseOne[0], 'shown.bs.collapse', function () {
-        assert.ok($collapseOne.hasClass('show'), '#collapseOne is shown')
-        assert.ok(!$collapseTwo.hasClass('show'), '#collapseTwo is not shown')
+      $nestedCollapseOne[0].addEventListener('shown.bs.collapse', handlerNestedCollapseOne)
+      $nestedTrigger[0].dispatchEvent(new Event('click'))
+      $collapseOne[0].removeEventListener('shown.bs.collapse', handlerCollapseOne)
+    }
+
+    function handlerNestedCollapseOne() {
+      assert.ok($collapseOne.hasClass('show'), '#collapseOne is shown')
+      assert.ok(!$collapseTwo.hasClass('show'), '#collapseTwo is not shown')
+      assert.ok($nestedCollapseOne.hasClass('show'), '#nestedCollapseOne is shown')
+
+      $collapseTwo[0].addEventListener('shown.bs.collapse', function () {
+        assert.ok(!$collapseOne.hasClass('show'), '#collapseOne is not shown')
+        assert.ok($collapseTwo.hasClass('show'), '#collapseTwo is shown')
         assert.ok($nestedCollapseOne.hasClass('show'), '#nestedCollapseOne is shown')
-        EventHandler.one($collapseTwo[0], 'shown.bs.collapse', function () {
-          assert.ok(!$collapseOne.hasClass('show'), '#collapseOne is not shown')
-          assert.ok($collapseTwo.hasClass('show'), '#collapseTwo is shown')
-          assert.ok($nestedCollapseOne.hasClass('show'), '#nestedCollapseOne is shown')
-          done()
-        })
-        EventHandler.trigger($triggerTwo[0], 'click')
+        done()
       })
-      EventHandler.trigger($nestedTrigger[0], 'click')
-    })
-    EventHandler.trigger($trigger[0], 'click')
+      $triggerTwo[0].dispatchEvent(new Event('click'))
+      $nestedCollapseOne[0].removeEventListener('shown.bs.collapse', handlerNestedCollapseOne)
+    }
+
+    $collapseOne[0].addEventListener('shown.bs.collapse', handlerCollapseOne)
+    $trigger[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not prevent event for input', function (assert) {
@@ -718,7 +725,7 @@ $(function () {
     var $target = $('<input type="checkbox" data-toggle="collapse" data-target="#collapsediv1" />').appendTo('#qunit-fixture')
     var $collapse = $('<div id="collapsediv1"/>').appendTo('#qunit-fixture')
 
-    EventHandler.one($collapse[0], 'shown.bs.collapse', function () {
+    $collapse[0].addEventListener('shown.bs.collapse', function () {
       assert.ok($collapse.hasClass('show'))
       assert.ok($target.attr('aria-expanded') === 'true')
       assert.ok($target.prop('checked'))
@@ -753,11 +760,11 @@ $(function () {
           assert.ok($trigger3.hasClass('collapsed'), 'trigger3 has collapsed class')
           done()
         })
-        EventHandler.trigger($trigger1[0], 'click')
+        $trigger1[0].dispatchEvent(new Event('click'))
       })
-      EventHandler.trigger($trigger2[0], 'click')
+      $trigger2[0].dispatchEvent(new Event('click'))
     })
-    EventHandler.trigger($trigger3[0], 'click')
+    $trigger3[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should set aria-expanded="true" to triggers targeting shown collaspe and aria-expanded="false" only when all the targeted collapses are shown', function (assert) {
@@ -785,11 +792,11 @@ $(function () {
           assert.strictEqual($trigger3.attr('aria-expanded'), 'false', 'aria-expanded on trigger3 is "false"')
           done()
         })
-        EventHandler.trigger($trigger1[0], 'click')
+        $trigger1[0].dispatchEvent(new Event('click'))
       })
-      EventHandler.trigger($trigger2[0], 'click')
+      $trigger2[0].dispatchEvent(new Event('click'))
     })
-    EventHandler.trigger($trigger3[0], 'click')
+    $trigger3[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not prevent interactions inside the collapse element', function (assert) {
@@ -803,7 +810,7 @@ $(function () {
       '</div>'
     var $collapse = $(htmlCollapse).appendTo('#qunit-fixture')
 
-    EventHandler.one($collapse[0], 'shown.bs.collapse', function () {
+    $collapse[0].addEventListener('shown.bs.collapse', function () {
       assert.ok($target.prop('checked'), '$trigger is checked')
       var $testCheckbox = $('#testCheckbox')
       $testCheckbox.trigger($.Event('click'))
diff --git a/js/tests/unit/dropdown.js b/js/tests/unit/dropdown.js
index c89d5abb2..44fe761ad 100644
--- a/js/tests/unit/dropdown.js
+++ b/js/tests/unit/dropdown.js
@@ -90,7 +90,7 @@ $(function () {
         assert.ok(!$dropdown.parent('.dropdown').hasClass('position-static'), '"position-static" class not added')
         done()
       })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should add class position-static to dropdown if boundary not scrollParent', function (assert) {
@@ -112,7 +112,7 @@ $(function () {
         assert.ok($dropdown.parent('.dropdown').hasClass('position-static'), '"position-static" class added')
         done()
       })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should set aria-expanded="true" on target when dropdown menu is shown', function (assert) {
@@ -136,11 +136,11 @@ $(function () {
 
     var dropdownParent = $dropdown.parent('.dropdown')[0]
 
-    EventHandler.on(dropdownParent, 'shown.bs.dropdown', function () {
+    dropdownParent.addEventListener('shown.bs.dropdown', function () {
       assert.strictEqual($dropdown.attr('aria-expanded'), 'true', 'aria-expanded is set to string "true" on click')
       done()
     })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should set aria-expanded="false" on target when dropdown menu is hidden', function (assert) {
@@ -164,13 +164,13 @@ $(function () {
 
     var dropdownParent = $dropdown.parent('.dropdown')[0]
 
-    EventHandler.one(dropdownParent, 'hidden.bs.dropdown', function () {
+    dropdownParent.addEventListener('hidden.bs.dropdown', function () {
       assert.strictEqual($dropdown.attr('aria-expanded'), 'false', 'aria-expanded is set to string "false" on hide')
       done()
     })
 
-    EventHandler.trigger($dropdown[0], 'click')
-    EventHandler.trigger(document.body, 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
+    document.body.click()
   })
 
   QUnit.test('should not open dropdown if target is disabled via class', function (assert) {
@@ -221,7 +221,7 @@ $(function () {
         assert.ok($dropdown.parent('.dropdown').hasClass('show'), '"show" class added on click')
         done()
       })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should remove "show" class if body is clicked', function (assert) {
@@ -253,7 +253,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should remove "show" class if tabbing outside of menu', function (assert) {
@@ -279,16 +279,16 @@ $(function () {
       .on('shown.bs.dropdown', function () {
         assert.ok($dropdown.parent('.dropdown').hasClass('show'), '"show" class added on click')
 
-        EventHandler.trigger(document.body, 'keyup', {
-          which: 9 // Tab
-        })
+        var keyup9 = new Event('keyup')
+        keyup9.which = 9 // Tab
+        document.dispatchEvent(keyup9)
       })
       .on('hidden.bs.dropdown', function () {
         assert.ok(!$dropdown.parent('.dropdown').hasClass('show'), '"show" class removed')
         done()
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should remove "show" class if body is clicked, with multiple dropdowns', function (assert) {
@@ -322,7 +322,7 @@ $(function () {
         $(document.body).trigger('click')
       }).on('hidden.bs.dropdown', function () {
         assert.strictEqual($('#qunit-fixture .dropdown-menu.show').length, 0, '"show" class removed')
-        EventHandler.trigger($last[0], 'click')
+        $last[0].dispatchEvent(new Event('click'))
       })
 
     $last.parent('.btn-group')
@@ -334,7 +334,7 @@ $(function () {
         assert.strictEqual($('#qunit-fixture .dropdown-menu.show').length, 0, '"show" class removed')
         done()
       })
-    EventHandler.trigger($first[0], 'click')
+    $first[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should remove "show" class if body if tabbing outside of menu, with multiple dropdowns', function (assert) {
@@ -365,26 +365,26 @@ $(function () {
       .on('shown.bs.dropdown', function () {
         assert.strictEqual($first.parents('.show').length, 1, '"show" class added on click')
         assert.strictEqual($('#qunit-fixture .dropdown-menu.show').length, 1, 'only one dropdown is shown')
-        EventHandler.trigger(document.body, 'keyup', {
-          which: 9 // Tab
-        })
+        var keyup = new Event('keyup')
+        keyup.which = 9 // Tab
+        document.dispatchEvent(keyup)
       }).on('hidden.bs.dropdown', function () {
         assert.strictEqual($('#qunit-fixture .dropdown-menu.show').length, 0, '"show" class removed')
-        EventHandler.trigger($last[0], 'click')
+        $last[0].dispatchEvent(new Event('click'))
       })
 
     $last.parent('.btn-group')
       .on('shown.bs.dropdown', function () {
         assert.strictEqual($last.parent('.show').length, 1, '"show" class added on click')
         assert.strictEqual($('#qunit-fixture .dropdown-menu.show').length, 1, 'only one dropdown is shown')
-        EventHandler.trigger(document.body, 'keyup', {
-          which: 9 // Tab
-        })
+        var keyup = new Event('keyup')
+        keyup.which = 9 // Tab
+        document.dispatchEvent(keyup)
       }).on('hidden.bs.dropdown', function () {
         assert.strictEqual($('#qunit-fixture .dropdown-menu.show').length, 0, '"show" class removed')
         done()
       })
-    EventHandler.trigger($first[0], 'click')
+    $first[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should fire show and hide event', function (assert) {
@@ -417,8 +417,8 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
-    EventHandler.trigger(document.body, 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
+    document.body.click()
   })
 
   QUnit.test('should fire shown and hidden event', function (assert) {
@@ -451,8 +451,8 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
-    EventHandler.trigger(document.body, 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
+    document.body.click()
   })
 
   QUnit.test('should fire shown and hidden event with a relatedTarget', function (assert) {
@@ -484,7 +484,7 @@ $(function () {
         $(document.body).trigger('click')
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should fire hide and hidden event with a clickEvent', function (assert) {
@@ -598,7 +598,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should skip disabled element when using keyboard navigation', function (assert) {
@@ -633,7 +633,7 @@ $(function () {
         assert.ok(!$(document.activeElement).is(':disabled'), ':disabled is not focused')
         done()
       })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should focus next/previous element when using keyboard navigation', function (assert) {
@@ -658,23 +658,21 @@ $(function () {
       .on('shown.bs.dropdown', function () {
         assert.ok(true, 'shown was fired')
 
-        EventHandler.trigger($dropdown[0], 'keydown', {
-          which: 40
-        })
+        var keydown40 = new Event('keydown')
+        keydown40.which = 40
+        $dropdown[0].dispatchEvent(keydown40)
         assert.ok($(document.activeElement).is($('#item1')), 'item1 is focused')
 
-        EventHandler.trigger(document.activeElement, 'keydown', {
-          which: 40
-        })
+        document.activeElement.dispatchEvent(keydown40)
         assert.ok($(document.activeElement).is($('#item2')), 'item2 is focused')
 
-        EventHandler.trigger(document.activeElement, 'keydown', {
-          which: 38
-        })
+        var keydown38 = new Event('keydown')
+        keydown38.which = 38
+        document.activeElement.dispatchEvent(keydown38)
         assert.ok($(document.activeElement).is($('#item1')), 'item1 is focused')
         done()
       })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not close the dropdown if the user clicks on a text field', function (assert) {
@@ -701,9 +699,9 @@ $(function () {
       .parent('.dropdown')
       .on('shown.bs.dropdown', function () {
         assert.ok($dropdown.parent('.dropdown').hasClass('show'), 'dropdown menu is shown')
-        EventHandler.trigger($textfield[0], 'click')
+        $textfield[0].dispatchEvent(new Event('click'))
       })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not close the dropdown if the user clicks on a textarea', function (assert) {
@@ -730,9 +728,9 @@ $(function () {
       .parent('.dropdown')
       .on('shown.bs.dropdown', function () {
         assert.ok($dropdown.parent('.dropdown').hasClass('show'), 'dropdown menu is shown')
-        EventHandler.trigger($textarea[0], 'click')
+        $textarea[0].dispatchEvent(new Event('click'))
       })
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('Dropdown should not use Popper.js in navbar', function (assert) {
@@ -761,7 +759,7 @@ $(function () {
         assert.ok(typeof $dropdownMenu.attr('style') === 'undefined', 'No inline style applied by Popper.js')
         done()
       })
-    EventHandler.trigger($triggerDropdown[0], 'click')
+    $triggerDropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should ignore keyboard events for <input>s and <textarea>s within dropdown-menu, except for escape key', function (assert) {
@@ -824,15 +822,15 @@ $(function () {
 
         // Key escape
         $input.trigger('focus')
-        EventHandler.trigger($input[0], 'keydown', {
-          which: 27
-        })
+        var keydown = new Event('keydown')
+        keydown.which = 27
+        $input[0].dispatchEvent(keydown)
 
         assert.ok(!$dropdown.parent('.dropdown').hasClass('show'), 'dropdown menu is not shown')
         done()
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should ignore space key events for <input>s within dropdown, and accept up, down and escape', function (assert) {
@@ -873,9 +871,9 @@ $(function () {
 
         // Key escape
         $input.trigger('focus')
-        EventHandler.trigger($input[0], 'keydown', {
-          which: 27
-        })
+        var keydown = new Event('keydown')
+        keydown.which = 27
+        $input[0].dispatchEvent(keydown)
         assert.ok(!$dropdown.parent('.dropdown').hasClass('show'), 'dropdown menu is not shown')
 
         $dropdown
@@ -885,9 +883,9 @@ $(function () {
 
             // Key down
             $input.trigger('focus')
-            EventHandler.trigger($input[0], 'keydown', {
-              which: 40
-            })
+            var keydown40 = new Event('keydown')
+            keydown40.which = 40
+            $input[0].dispatchEvent(keydown40)
             assert.ok(document.activeElement === $('#item1')[0], 'item1 is focused')
 
             $dropdown
@@ -895,17 +893,18 @@ $(function () {
               .one('shown.bs.dropdown', function () {
                 // Key up
                 $input.trigger('focus')
-                EventHandler.trigger($input[0], 'keydown', {
-                  which: 38
-                })
+                var keydown38 = new Event('keydown')
+                keydown38.which = 38
+                $input[0].dispatchEvent(keydown38)
+
                 assert.ok(document.activeElement === $('#item1')[0], 'item1 is focused')
                 done()
               }).bootstrapDropdown('toggle')
-            EventHandler.trigger($input[0], 'click')
+            $input[0].dispatchEvent(new Event('click'))
           })
-        EventHandler.trigger($input[0], 'click')
+        $input[0].dispatchEvent(new Event('click'))
       })
-    EventHandler.trigger($input[0], 'click')
+    $input[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should ignore space key events for <textarea>s within dropdown, and accept up, down and escape', function (assert) {
@@ -946,9 +945,9 @@ $(function () {
 
         // Key escape
         $textarea.trigger('focus')
-        EventHandler.trigger($textarea[0], 'keydown', {
-          which: 27
-        })
+        var keydown27 = new Event('keydown')
+        keydown27.which = 27
+        $textarea[0].dispatchEvent(keydown27)
         assert.ok(!$dropdown.parent('.dropdown').hasClass('show'), 'dropdown menu is not shown')
 
         $dropdown
@@ -958,9 +957,9 @@ $(function () {
 
             // Key down
             $textarea.trigger('focus')
-            EventHandler.trigger($textarea[0], 'keydown', {
-              which: 40
-            })
+            var keydown40 = new Event('keydown')
+            keydown40.which = 40
+            $textarea[0].dispatchEvent(keydown40)
             assert.ok(document.activeElement === $('#item1')[0], 'item1 is focused')
 
             $dropdown
@@ -968,17 +967,18 @@ $(function () {
               .one('shown.bs.dropdown', function () {
                 // Key up
                 $textarea.trigger('focus')
-                EventHandler.trigger($textarea[0], 'keydown', {
-                  which: 38
-                })
+                var keydown38 = new Event('keydown')
+                keydown38.which = 38
+                $textarea[0].dispatchEvent(keydown38)
+
                 assert.ok(document.activeElement === $('#item1')[0], 'item1 is focused')
                 done()
               }).bootstrapDropdown('toggle')
-            EventHandler.trigger($textarea[0], 'click')
+            $textarea[0].dispatchEvent(new Event('click'))
           })
-        EventHandler.trigger($textarea[0], 'click')
+        $textarea[0].dispatchEvent(new Event('click'))
       })
-    EventHandler.trigger($textarea[0], 'click')
+    $textarea[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should not use Popper.js if display set to static', function (assert) {
@@ -1008,7 +1008,7 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($dropdown[0], 'click')
+    $dropdown[0].dispatchEvent(new Event('click'))
   })
 
   QUnit.test('should call Popper.js and detect navbar on update', function (assert) {
diff --git a/js/tests/unit/popover.js b/js/tests/unit/popover.js
index 023db6753..9f267894d 100644
--- a/js/tests/unit/popover.js
+++ b/js/tests/unit/popover.js
@@ -281,14 +281,14 @@ $(function () {
       })
       .one('shown.bs.popover', function () {
         assert.notEqual($('.popover').length, 0, 'popover was inserted')
-        EventHandler.trigger($div.find('a')[0], 'click')
+        $div.find('a')[0].click()
       })
       .one('hidden.bs.popover', function () {
         assert.strictEqual($('.popover').length, 0, 'popover was removed')
         done()
       })
 
-    EventHandler.trigger($div.find('a')[0], 'click')
+    $div.find('a')[0].click()
   })
 
   QUnit.test('should detach popover content rather than removing it so that event handlers are left intact', function (assert) {
@@ -438,11 +438,11 @@ $(function () {
       })
 
     $popover.bootstrapPopover('disable')
-    EventHandler.trigger($popover[0], 'click')
+    $popover[0].click()
     setTimeout(function () {
       assert.strictEqual($('.popover').length === 0, true)
       $popover.bootstrapPopover('enable')
-      EventHandler.trigger($popover[0], 'click')
+      $popover[0].click()
     }, 200)
   })
 
@@ -464,6 +464,6 @@ $(function () {
         done()
       })
 
-    EventHandler.trigger($popover[0], 'click')
+    $popover[0].click()
   })
 })
diff --git a/js/tests/unit/scrollspy.js b/js/tests/unit/scrollspy.js
index 27f899576..cf0539730 100644
--- a/js/tests/unit/scrollspy.js
+++ b/js/tests/unit/scrollspy.js
@@ -665,7 +665,7 @@ $(function () {
           method: 'offset'
         })
       } else if (type === 'data') {
-        EventHandler.trigger(window, 'load')
+        window.dispatchEvent(new Event('load'))
       }
 
       var $target = $('#div-' + type + 'm-2')
@@ -712,7 +712,7 @@ $(function () {
           method: 'position'
         })
       } else if (type === 'data') {
-        EventHandler.trigger(window, 'load')
+        window.dispatchEvent(new Event('load'))
       }
 
       var $target = $('#div-' + type + 'm-2')
diff --git a/js/tests/unit/tab.js b/js/tests/unit/tab.js
index 00dcac18f..5ea88c46b 100644
--- a/js/tests/unit/tab.js
+++ b/js/tests/unit/tab.js
@@ -320,7 +320,7 @@ $(function () {
         '</ul>'
     var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
 
-    EventHandler.trigger($tabs.find('li:last-child a')[0], 'click')
+    $tabs.find('li:last-child a')[0].click()
     assert.notOk($tabs.find('li:first-child a').hasClass('active'))
     assert.ok($tabs.find('li:last-child a').hasClass('active'))
   })
@@ -339,7 +339,7 @@ $(function () {
         '</ul>'
     var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
 
-    EventHandler.trigger($tabs.find('li:first-child a')[0], 'click')
+    $tabs.find('li:first-child a')[0].click()
     assert.ok($tabs.find('li:first-child a').hasClass('active'))
     assert.notOk($tabs.find('li:last-child a').hasClass('active'))
     assert.notOk($tabs.find('li:last-child .dropdown-menu a:first-child').hasClass('active'))
@@ -378,10 +378,10 @@ $(function () {
 
     $('#tab1').on('shown.bs.tab', function () {
       assert.ok($('#x-tab1').hasClass('active'))
-      EventHandler.trigger($('#tabNested2')[0], 'click')
+      $('#tabNested2')[0].click()
     })
 
-    EventHandler.trigger($('#tab1')[0], 'click')
+    $('#tab1')[0].click()
   })
 
   QUnit.test('should not remove fade class if no active pane is present', function (assert) {
@@ -412,10 +412,10 @@ $(function () {
             done()
           })
 
-        EventHandler.trigger($('#tab-home')[0], 'click')
+        $('#tab-home')[0].click()
       })
 
-    EventHandler.trigger($('#tab-profile')[0], 'click')
+    $('#tab-profile')[0].click()
   })
 
   QUnit.test('should handle removed tabs', function (assert) {
diff --git a/js/tests/unit/tooltip.js b/js/tests/unit/tooltip.js
index 8c6d604b7..23cd0cafd 100644
--- a/js/tests/unit/tooltip.js
+++ b/js/tests/unit/tooltip.js
@@ -583,7 +583,7 @@ $(function () {
       done()
     }, 200)
 
-    EventHandler.trigger($tooltip[0], 'mouseover')
+    $tooltip[0].dispatchEvent(new Event('mouseover'))
   })
 
   QUnit.test('should not show tooltip if leave event occurs before delay expires', function (assert) {
@@ -598,7 +598,7 @@ $(function () {
 
     setTimeout(function () {
       assert.ok(!$('.tooltip').is('.fade.show'), '100ms: tooltip not faded active')
-      EventHandler.trigger($tooltip[0], 'mouseout')
+      $tooltip[0].dispatchEvent(new Event('mouseout'))
     }, 100)
 
     setTimeout(function () {
@@ -606,7 +606,7 @@ $(function () {
       done()
     }, 200)
 
-    EventHandler.trigger($tooltip[0], 'mouseover')
+    $tooltip[0].dispatchEvent(new Event('mouseover'))
   })
 
   QUnit.test('should not hide tooltip if leave event occurs and enter event occurs within the hide delay', function (assert) {
@@ -624,11 +624,11 @@ $(function () {
 
     setTimeout(function () {
       assert.ok($('.tooltip').is('.fade.show'), '1ms: tooltip faded active')
-      EventHandler.trigger($tooltip[0], 'mouseout')
+      $tooltip[0].dispatchEvent(new Event('mouseout'))
 
       setTimeout(function () {
         assert.ok($('.tooltip').is('.fade.show'), '100ms: tooltip still faded active')
-        EventHandler.trigger($tooltip[0], 'mouseover')
+        $tooltip[0].dispatchEvent(new Event('mouseover'))
       }, 100)
 
       setTimeout(function () {
@@ -637,7 +637,7 @@ $(function () {
       }, 200)
     }, 0)
 
-    EventHandler.trigger($tooltip[0], 'mouseover')
+    $tooltip[0].dispatchEvent(new Event('mouseover'))
   })
 
   QUnit.test('should not show tooltip if leave event occurs before delay expires', function (assert) {
@@ -652,7 +652,7 @@ $(function () {
 
     setTimeout(function () {
       assert.ok(!$('.tooltip').is('.fade.show'), '100ms: tooltip not faded active')
-      EventHandler.trigger($tooltip[0], 'mouseout')
+      $tooltip[0].dispatchEvent(new Event('mouseout'))
     }, 100)
 
     setTimeout(function () {
@@ -660,7 +660,7 @@ $(function () {
       done()
     }, 200)
 
-    EventHandler.trigger($tooltip[0], 'mouseover')
+    $tooltip[0].dispatchEvent(new Event('mouseover'))
   })
 
   QUnit.test('should not show tooltip if leave event occurs before delay expires, even if hide delay is 0', function (assert) {
@@ -678,7 +678,7 @@ $(function () {
 
     setTimeout(function () {
       assert.ok(!$('.tooltip').is('.fade.show'), '100ms: tooltip not faded active')
-      EventHandler.trigger($tooltip[0], 'mouseout')
+      $tooltip[0].dispatchEvent(new Event('mouseout'))
     }, 100)
 
     setTimeout(function () {
@@ -686,7 +686,7 @@ $(function () {
       done()
     }, 250)
 
-    EventHandler.trigger($tooltip[0], 'mouseover')
+    $tooltip[0].dispatchEvent(new Event('mouseover'))
   })
 
   QUnit.test('should wait 200ms before hiding the tooltip', function (assert) {
@@ -705,7 +705,7 @@ $(function () {
     setTimeout(function () {
       assert.ok($(Tooltip._getInstance($tooltip[0]).tip).is('.fade.show'), '1ms: tooltip faded active')
 
-      EventHandler.trigger($tooltip[0], 'mouseout')
+      $tooltip[0].dispatchEvent(new Event('mouseout'))
 
       setTimeout(function () {
         assert.ok($(Tooltip._getInstance($tooltip[0]).tip).is('.fade.show'), '100ms: tooltip still faded active')
@@ -717,7 +717,7 @@ $(function () {
       }, 200)
     }, 0)
 
-    EventHandler.trigger($tooltip[0], 'mouseover')
+    $tooltip[0].dispatchEvent(new Event('mouseover'))
   })
 
   QUnit.test('should not reload the tooltip on subsequent mouseenter events', function (assert) {
@@ -742,11 +742,11 @@ $(function () {
       title: titleHtml
     })
 
-    EventHandler.trigger($('#tt-outer')[0], 'mouseover')
+    $('#tt-outer')[0].dispatchEvent(new Event('mouseover'))
 
     var currentUid = $('#tt-content').text()
 
-    EventHandler.trigger($('#tt-outer')[0], 'mouseover')
+    $('#tt-outer')[0].dispatchEvent(new Event('mouseover'))
     assert.strictEqual(currentUid, $('#tt-content').text())
   })
 
@@ -774,16 +774,16 @@ $(function () {
 
     var obj = Tooltip._getInstance($tooltip[0])
 
-    EventHandler.trigger($('#tt-outer')[0], 'mouseover')
+    $('#tt-outer')[0].dispatchEvent(new Event('mouseover'))
 
     var currentUid = $('#tt-content').text()
 
-    EventHandler.trigger($('#tt-outer')[0], 'mouseout')
+    $('#tt-outer')[0].dispatchEvent(new Event('mouseout'))
     assert.strictEqual(currentUid, $('#tt-content').text())
 
     assert.ok(obj._hoverState === 'out', 'the tooltip hoverState should be set to "out"')
 
-    EventHandler.trigger($('#tt-outer')[0], 'mouseover')
+    $('#tt-outer')[0].dispatchEvent(new Event('mouseover'))
     assert.ok(obj._hoverState === 'show', 'the tooltip hoverState should be set to "show"')
 
     assert.strictEqual(currentUid, $('#tt-content').text())
@@ -839,7 +839,7 @@ $(function () {
 
     $.each(tests, function (idx, triggers) {
       for (var i = 0, len = triggers.length; i < len; i++) {
-        EventHandler.trigger($el[0], triggers[i])
+        $el[0].dispatchEvent(new Event(triggers[i]))
         assert.equal(i < len - 1, showingTooltip())
       }
     })
@@ -861,13 +861,13 @@ $(function () {
       return $tooltip.hasClass('show') || tooltip._hoverState === 'show'
     }
 
-    EventHandler.trigger($el[0], 'click')
+    $el[0].click()
     assert.ok(showingTooltip(), 'tooltip is faded in')
 
     $el.bootstrapTooltip('hide')
     assert.ok(!showingTooltip(), 'tooltip was faded out')
 
-    EventHandler.trigger($el[0], 'click')
+    $el[0].click()
     assert.ok(showingTooltip(), 'tooltip is faded in again')
   })
 
@@ -987,11 +987,11 @@ $(function () {
       })
 
     $trigger.bootstrapTooltip('disable')
-    EventHandler.trigger($trigger[0], 'click')
+    $trigger[0].click()
     setTimeout(function () {
       assert.strictEqual($('.tooltip').length === 0, true)
       $trigger.bootstrapTooltip('enable')
-      EventHandler.trigger($trigger[0], 'click')
+      $trigger[0].click()
     }, 200)
   })